Date: 10/31/05 (Opera Browser)    Keywords: browser, css

I've been experimenting with the positioning of various sections of a layout, prior to adding actual content and my own styling to it, and have come across something that's baffling me.

This is the testpage in question. The pages does what it's supposed to at this point in time in Opera at 800x600 and 1280x1024, but in 1024x768, a narrow gap emerges between the left section (coloured in red) and the header, content and footer sections on the right of the page. This gap doesn't appear in either IE or Firefox at any of those three resolutions.

Using the zoom control in my default screen resolution, I discovered once again that only enlarging the page to certain sizes caused the problem. Here's a zoomed-in screenshot to illustrate the problem.

Now, sure, I'm still learning how to use CSS effectively, but this gap (which shows up in both Opera 7.54 and Opera 8.5) confuses me. So, is it my coding that's at fault or is it an interesting glitch in Opera? (If others can't replicate the gap on their browsers, I'll assume it's a peculiarity of my monitor's default settings, and apologize profusely for wasting people's time!)

Source: http://www.livejournal.com/community/opera_browser/47530.html