Recovered from the Wayback Machine.
Here’s an interesting one:
I’ve had a couple of folks point out that my site layout does not appear correctly in Safari. If the page is opened in a Safari browser that’s smaller than the width of my content setting (currently at 925 pixels), no horizontal scrollbar is generated. However, a horizontal scrollbar is generated with Firefox (and with IE7 when tested, as well as Opera). Why is this?
I have an unusual layout in that I’m right justifying my content. Even with the new design, which features more elastic sizing (and hopefully should minimize horizontal scrolling), I’m still considering right justifying the content.
How I’m managing the right justification is that I have my right margin set to 20 pixels, but the left set to auto. Technically, I shouldn’t need to set my left margin to auto–it should be set this way by default when the right margin is given. However, I’ve found most browsers don’t do this correctly.
What should happen is that if one margin is given but not the other, the other should be set to auto. The browser should then measure the width of the content and the one margin and add enough to the other to meet 100% of the width. However, no browser does this. What they do is set the left margin to zero by default, regardless of how the right margin is set. By setting the left margin to auto, I remind the browsers of what they should be doing and I get right justified content.
Unfortunately, Safari has another bug: if the left margin is set to auto but the right margin is set to something else, when the browser window is less than the width of the content, the browser doesn’t provide a horizontal scrollbar.
Until I get my new site design up and running, in order to ensure that everyone can see the content regardless of browser window size, I’ve set both margins to auto for centered design. I’ve added some background fill to kill some of the white, but don’t get attached to it, it’s going away. Thanks to Pascale and John for pointing out the problem in Safari.
