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.
I have set up some divs for my layout, a main div and a menu div.
They look perfect in Firefox, but for some reason, Chrome and Safari get messed up.
For some reason the width of the div gets smaller when overflow:hidden; is added to the CSS. I need overflow:hidden; though, because I have other floats inside the main div. You can see the example here:
It shows up fine in Firefox, but in Safari and Chrome, there’s a margin on the right side of the div as well.
Removing the margin from
mainseems to fix it:http://jsfiddle.net/kR7rs/3/
What I think it happening is that when
overflow:hiddenis set, the entire element wraps around the floats instead of the text within the div. So this gives the result in the fiddle. Then if you set a margin on it also, the width is decreased further by the left padding.Kind of seems like a bug.
(Don’t have FF right now to test it and see if it breaks it for FF.)