Can someone tell me what I could be doing wrong. The following page works fine in IE8 and FireFox but elements of the CSS don’t seem to be being respected in Chrome and Safari. Thanks.
Share
Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
Can someone tell me what I could be doing wrong. The following page works fine in IE8 and FireFox but elements of the CSS don’t seem to be being respected in Chrome and Safari. Thanks.
Here’s what I’d do:
First, the div
#navigationthat wraps around the ul#navlistis redundant. Just style the ul like you would the div and lose the div altogether.Secondly, I would make the ul float left. Then I would make the content div float left and lose the margins. Make sure
#containerisoverflow:hidden;As long as you set the width of the ul and the content div, it should look good in all browsers.I’m actually baffled that it looks the way it does in Chrome… I’ll update this answer as I examine it more.
UPDATE
The user agent in chrome styles the ul
display: block;You should add a reset stylesheet to put all browsers on the same footing. Although, if you follow my above advice that will not be a direct issue. Let me know if you need set of reset rules I use.