Bram
Legacy Member
Hullo
Ik ben bezig aan een navigatie en zou willen gebruiken maken van sliding doors (1 sprite met verschillende states voor de knoppen, die breed genoeg voorzien is).
Nu gebruikte ik volgende code
En dan als html
Het probleem is: m'n buttons maken gebruik van transparantie. Sliding doors heeft z'n naam niet gestolen en de 2 achtergrondafbeeldingen overlappen dus, waardoor de schaduwen dus donkerder zijn in de overlap.
Iemand die dat probleem herkent en hier reeds een elegante oplossing voor gevonden heeft? Ik ben momenteel zelf iets aan het samenhacken, maar proper is het niet, so far.
Wel al oplossingen gevonden met 2 images, maar daar ben ik ook niet onmiddellijk fan van. Die oplossing gebruikt ook pixels, terwijl ik em's gebruik (enfin, niet dat dat zo'n grote hindernis is).
Ik ben bezig aan een navigatie en zou willen gebruiken maken van sliding doors (1 sprite met verschillende states voor de knoppen, die breed genoeg voorzien is).
Nu gebruikte ik volgende code
Code:
<ul>
<li><a><span>tekst</span></a></li>
</ul>
En dan als html
Code:
nav li a {
display: block;
background: url('../images/buttons.png') top left;
padding: 0 0 0 0.7em
}
nav li a span {
display: block;
line-height: 33px;
background: url('../images/buttons.png') top right;
padding: 0 0.7em 0 0
}
Iemand die dat probleem herkent en hier reeds een elegante oplossing voor gevonden heeft? Ik ben momenteel zelf iets aan het samenhacken, maar proper is het niet, so far.
Wel al oplossingen gevonden met 2 images, maar daar ben ik ook niet onmiddellijk fan van. Die oplossing gebruikt ook pixels, terwijl ik em's gebruik (enfin, niet dat dat zo'n grote hindernis is).
Ondertussen werkende gekregen. Gewoon buttons opgekapt in de sprite. Nav wordt nu toch al correct weergegeven.
