[CSS] Tworzenie menu, mam 3 obrazki ktore maja posluzyc jako tlo menu niestety cos sie psuje Opcje

[extreme170]

Witam mam 3 obrazki i chce za ich pomoca stworzyc takie menu.

(IMG:http://img374.imageshack.us/img374/2184/menuss1.jpg)

Wycialem sobie lewy obrazek zaokraglenie srodek i prawy i teraz mam problem z ulozeniem tego w spójną całość.
Tekst chce nakladać sobie dowolny. Czy może lepiej wziąść całe te elementy i ukladać jakos w DIVie?? proszę o pomoc bo z opcjami repeat-x itd i tworzeniem class dla menu mam problem i nie dziala to tak jakbym chcial bo pojawiają sie jakies marginesy nieoczekiwane... pomiędzy divami.

Probowalem to zrobic tak niestety nie bardzo funkcjonuje:

div#menu {
clear: both;
display:block;
padding : 0 0 0 0;
margin: 0 auto 0 auto;
width: 800px;
background: yellow;
height: 41px;
padding: 0 0 0 0;
}

div#menu .lewa {
background: url("menu_left.jpg");
float:left;
height: 41px;
width: 10px;
margin: 0 0 0 0;
padding: 0 0 0 0;
}

div#menu .link {
background: url("menu_repeat.jpg") repeat-x;
float:left;
width:100px;
height:41px;
margin: 0 0 0 0;
padding: 0 0 0 10px;
}

div#menu .prawa {
background: url("menu_right.jpg");
float:left;
height: 41px;
width: 10px;
margin: 0 0 0 0;
padding: 0 0 0 0;
}

HTML:

<div id="menu">
<div class="lewa"></div>
<div class="link"> Strona glowna </div>
<div class="prawa"></div>
</div>


a jak probowalem ostylowac listy tymi obrazkami to mimo ustawienia height: na wysokosc tych wycinkow moich zawsze zostawala wysokosc tekstu tylko.

umieszczam male obrazki jakby ktos dal rade zrobic div z id="menu" i ustawic to w jednej lini jak powyzej

(IMG:http://img374.imageshack.us/img374/3597/menuleftps5.jpg) -lewa czesc

(IMG:http://img374.imageshack.us/img374/5355/menurepeatjs0.jpg)  -srodek

(IMG:http://img374.imageshack.us/img374/4127/menurightfi7.jpg)  - prawa czesc

Ten post edytował extreme170 7.05.2008, 12:29:41

[cbagov]

Zeby height dzialalo tag MUSi miec display:BLOCK

A jeden ze sposobow na skladanie z tych 3 obrazkow i regularne buttony:

<div class="middle">
<div class="left">
<div class="right">
TEKST BUTTONA
</div></div></div>

Wtedy obrazkom dla kazdego diva nadajesz w klasie stylu
background: url(...) top left repeat-x
background: url(...) top left
background: url(...) top right


Oczywiscie w zaleznosci od funkcjonalnosci czesto lepiej zamiast 3x div miec od razu np LI, P czy SPAN