It’s just a simple <ul> list containing <a> links.
In each separate button I need to have a different graphic (the down arrow)
In my example I’m doing it with a span in the <a> tag.
I’m giving the span dimensions, positioning it and adding a background image using a sprite.
My question is, is it possible to do this without the span.
I’m creating this navigation in Wordpress and adding the span would be difficult.
On a side note I tried to center the span (in this example) in button by positioning it absolute and giving it a left:50% but it doesn’t appear in the center. Anyone know why.
If you are going to use a sprite image, you need some containing element like a span with dimensions. The way to (almost) center it is with the extra line in red:
nav li a span {
position: absolute;
left: 50%;
bottom: 15px;
display: block;
width: 13px;
height: 7px;
[COLOR="#FF0000"]margin-left: -7px;[/COLOR]
}
I say “almost”, because it’s 13px wide, so the margin can’t quite be half its width.
