Witam! Jak zrobić okrągły button składający się z 3 elementów ?
Mam na myśli lewa strona, powtarzający się środek i prawa strona.
Całość musi być linkiem jednak użycie elementów 'div' w 'a' nie jest poprawne.
W grę również nie wchodzi :before i :after.

[HTML] pobierz, plaintext 
<a href="#">
 <div class="menu_left"></div>
  <div class="menu_bg">
   <p>
    Strona Główna
   </p>
  </div>
 <div class="menu_right"></div>
</a>
[HTML] pobierz, plaintext 

Proszę o pomysły, pomoc

To zależy co chcesz uzyskać.

[HTML] pobierz, plaintext 
<div id="bottom">
<div id="left"><div>
<div id="right"><div>
 
 
<a>link<a/>
</div>
[HTML] pobierz, plaintext 

[CSS] pobierz, plaintext 
#bottom{width:20px}
#bottom a{width:20px}
 
#left{float:left}
#right{float:right}
[CSS] pobierz, plaintext 

To co kolega wyżej przedstawił nie będzie przyciskiem tylko grafiką 'oplatającą' linka.
Nie wiem dlaczego sądzisz, że wkładanie diva w linka jest nie poprawne. Ja bym to zrobił tak:

[HTML] pobierz, plaintext 
<a href=wp.pl>
<img class="left" src="left.jpg" />
<div class="link">tekst linku</div>
<img class="right" src="right.jpg" />
</a>
[HTML] pobierz, plaintext 

I style:

[HTML] pobierz, plaintext 
a img{
border:0;}
.left{
float:left;}
.right{
float:left;}
.link{
background-image:url(inside.jpg);
background-repeat:repeat-x;
float:left;
height:10px;
text-align:center;}
[HTML] pobierz, plaintext 

Zakładając, że przycisk ma mieć 10px wysokości.
Wszycho bangla jak należy, cała grafika jest linkiem, dopasowuje się do długości tekstu, można dodać efekt hover itp. Działa na wszystkich przeglądkach.

podobno validator wskazuje bledy jesli umiescimy div w a

To zależy od doctype, ale ja już Wam przedstawiłem że a robi się na display block, podaje mu się width i height inherit po div, i gra muzyka teścia biją, ludzie no! Ileż można jedno i to samo w kółko wałkować?

moglbys pokazac na jakims przykladzie ?

[HTML] pobierz, plaintext 
div#someDiv {
      width: 300px;
      height: 200px;
      background: red;
    }
    div#someDiv > a {
      display: block;
      width: inherit;
      height: inherit;
    }
 
    div#someDiv:hover {
      background: yellow;
    }
 
    <div id="someDiv">
      <a href="#" title="Some href">Some href</a>
    </div>
[HTML] pobierz, plaintext 

No dobra ale w IE nie zadziała hover dla elementu div

Zadziała, Poczytaj tutaj: IE kompatybilne z w3c

@edit
btw ten znak > też nie zadziała pod ie ;]

elementy to obrazki wiec hovera podepne pod js.
dziekuje za pomoc