- This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
Viewing 3 posts - 1 through 3 (of 3 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Hello, I have a site with an unnecessary horizontal scrollbar, and I can’t figure out what’s forcing multiple browsers to think the page is wider than it’s intended to be.
Link to the page (pardon the roughness, it’s a work in progress): http://www.alliedfence.com/dev/
Here’s a screenshot: http://i37.tinypic.com/20u4xuf.png
My CSS file includes:
.post,#content .page{
clear:both;
margin:0em auto 0em;
overflow:visible;
width:80em;}
When I drop the width down to 72em or so, the scrollbar disappears, but then the content is significantly narrower than the header/footer. As you can see on the page, there’s plenty of whitespace on either side.
(I also don’t want to use overflow-x to just hide the scrollbar, because I want it to be visible if someone’s viewing the site in a really low-resolution/small browser window. Plus it doesn’t seem like a clean fix.)
This is probably something really stupid and easy, but I’ve been poring over it for ages, and I’d really appreciate any help! Thanks so much.
try using percentage instead of em for width? just an idea you could play around with.
http://css-discuss.incutio.com/?page=EmVsPercentWidths
Thank you for the suggestion and the link!
Unfortunately when I try using percent instead of em, I have to go up to at least 140%, and it renders very differently across browers — plus the scrollbar is still there.
On the other hand, what your link is saying about larger font-size and em causing problems makes sense: my font-size is 16px/1em, and when I drop it down the scrollbar vanishes. But then not only is the text size smaller, but the whole page renders much narrower.
Any thoughts?