how to implement feature nav dots on iBlogPro

[aeverse 0]

See image below. The designer has spec'd a dot-style feature nav superimposed over the media image rather than below it. I have been trying VERY hard to figure out how to use the "dots" styling in iBlogPro. I accidentally got it to work in a PageLinesPro iteration of the site that I was trying to use, but I just don't have time to rebuild the site there. I'm now back to my original, nearly complete site built on iBlogPro. I've tried applying all the css from my accidental version, but can't seem to figure out which PHP pages need to be edited to render the style. How would I do that? Help, please! http://www.hytrainium.com/wp-dev/

[kastelic 6]

#featurenav a{}
	#featurenav a.active{}

I would target the backgrounds of these rules to eliminate the current background and add your own image of a dot, and a colored dot for the active one. To remove the number you could set the font-size to 0px. If you wanted a quicker fix you could set line-height to 12px and font-size to 0px and get instant sort-of-squarish dots. Use Firefox with Firebug to see all the rules affecting these elements (border, etc.)

[aeverse 0]

Great idea. I'll give that a try. Much simpler than what I was trying to do. Thanks!

[aeverse 0]

Ok... back on this task after several days on other elements. I actually got the css-based feature nav set up, but just can't get the elements to stack in the right order. I've tried applying z-index numbers to various divs but nothing seems to work.

[cmunns 16]

Try adding position:relative to the feature-footer css selector.

[aeverse 0]

That worked! Thanks Adam!