Citat:
Ursprungligen postat av marcuslind
Angående li och a elmenten så menar du alltså något följande:
<li>
<a href="#">START</a>
</li>
li{
background: url(left.png);
background-position: top left;
}
a{
background: url(right.png);
background-position: top right;
}
?
Angående att använda långa bilder med dubbla knappar över/under vill jag inte använda mig av när sajten ska vara dynamisk. Vill kunden lägga till en längre länktext som "Produkter och Tjänster" eller om de vill ha en kortare som "Hem" så ska knappens storlek anpassa sig efter texten. Om man använder sig av statiska bilder så är bredden lika stor på varje knapp vilket inte efterfrågas i detta fall.
Du har rätt i li och a elementen. Jag borde gjort det på det viset, jag tänkte helt enkelt inte på det. |
Det är precis samma sak som att ha 2 bilder, skillnaden är mindre request till servern (IE6 och hover gör ny request oavsett sprites eller inte).
Så har du en sprite med left och right bilderna och bara positionerar dom på li och a, samma gäller för en lång bild, bara positionera den left eller right.
Ta en titt på youtube vettja,
http://s.ytimg.com/yt/img/master-vfl125983.png