trudne element grafiki - jak pociąć?

Witam,

Mam element strony, który wygląda jak box. Ma zaokrąglone dwa roki(po przekątnej), bordera białego i delikatnie szary kulisty gradient w środku box'a. Szerokość box'a to około 1000px, a wysokość około 250px. Będzie znajdować się w nim tekst, obrazki itd. Ma on zmieniać dł. względem ilości contentu znajdującego się w nim.

Moje pytanie:

Jak pociąć taki element grafiki i osadzić go w html? Problem robi ten kulisty gradient. Wiadomo, że dł. tekstu będzie
zmienna. Jakby to był poziomy czy pionowy gradient to pociąłbym w paski o szerokości np 1px i puścił odpowiednio na x i y.
I po problemie, ale ten gradient zajmuje tutaj całą wysokość 250px.

css3 ma gradienty, w tym radialne

zostaje przy css3, dobrze wygląda. racja.

wiesz może jak umieścić pionowe paski(separatory) w menu (na liście) po między nazwami podstron? Chcę uzyskać coś takiego:

AKTULNOŚCI | KARIERA | MAPA | KONTAKT

gdzie pionowa kreska: | <-- to pasek

Chodzi głównie o to, że paski są tylko pomiędzy wyrazami. Jak widać nie ma ich na początku, ani na końcu menu.
ja robię tak,że daje na końcu każdej nazwy po za ostatnią, ale jak wrzucę to do CMS to będzie problem.

<ul>
<li>aktualnosci</li>
<li>kariera</li>
<li>mapa</li>
<li>kontakt</li>
</ul>

ul>li {
  border-left: 1px solid red; /* albo jakis inny styl */
}
ul>li:first-child {
  border-left: none;
}

Używam first-child ze względu na to, że jest dostępne nawet dla IE8 (które wciąż ma spory udział na rynku --- masz więc fallbacki dla swojego gradientu?)

To mój gradient:

 
background: radial-gradient(circle, #FEFEFE, #F5F4F7);	
	background-color: #FBFBFC;  
	background-position: center center;
	background-repeat: no-repeat;
	/* Safari 4-5, Chrome 1-9 */	
	background: -webkit-gradient(radial, center center, 0, center center, 460, from(#FEFEFE), to(#F5F4F7));
	/* Safari 5.1+, Chrome 10+ */
	background: -webkit-radial-gradient(circle, #FEFEFE, #F5F4F7);
	/* Firefox 3.6+ */
	background: -moz-radial-gradient(circle, #FEFEFE, #F5F4F7);
	/* IE 10 */
	background: -ms-radial-gradient(circle, #FEFEFE, #F5F4F7);

A first-child będzie działać w starszych przeglądarkach? takich jak IE6? albo coś koło tego?