When you re size it to 520px I have the style sheet change. However the nav bar doesn’t switch to be in a straight line unless you refresh the page. Any ideas?
The issue: you have wrapped your LI elements inside your anchor elements which is an inline element while the LI element is a block level element, simply switch them around and the problem should fix itself given your CSS is correct and semantic.
@wolfcry911 Correct, however they shouldn’t wrap list items. The immediate children of lists should be list items.
The li element represents a list item. If its parent element is an ol, ul, or menu element, then the element is an item of the parent element’s list, as defined for those elements. Otherwise, the list item has no defined list-related relationship to any other li element.
@wolfcry911 You don’t ever need to feel foolish mate, it would be impossible to remember every little detail of the HTML5 specification. Besides, you are one of the top contributors to the CSS-Tricks forums and I respect all the advice that you give.
After changing it the text indent has to be applied to nav and not nav a. After that happens though they stop acting like links and break… Should I move the images from background to the markup?
So just to follow up.. Putting the image inside the markup didnt work because it was a sprite, and would re size when adjusting the width. So I had to change the css to be #whatever a { display:block } so I could still have the background image and the text indent.
Author
Posts
Viewing 7 posts - 1 through 7 (of 7 total)
The forum ‘CSS’ is closed to new topics and replies.
