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.
Here on this WordPress site http://www.grappler.tk/dyebeta/ when I resize the browser to less then about 500px then a scroll bar appears at the bottom and I get empty space on the right hand size.
header-logo is 600px wide. This causes the scrollbar, even though the children inside #header-logo have % widths or no set width so they don’t seem to overflow, but they do.
You can either have #header-logo have no width and use an @media query to add min-width:600px on larger screens (if you need a width because it’s a float or something), OR you can keep the width: 600px on that and set everyone else to a min-width of 600px as well (that would ruin your responsiveness though).
When you resize your browser to smaller than 500px or so, the main box is keeping to the width: 90% you’ve set… 90% of the body. Strangely enough, your body element is doing as I expect (it’s only a bit wider than your wrap) but the background colour is continuing on (usually that also gets cut off). Maybe it’s being painted onto the html element, who always fills the viewport no matter what.
I love the body:after content, that’s a neat debugging tool