Weird Opera float problem

[Andrew]

I'm developing a site using CSS layout. One of the main divs contains
the content, another contains the side bar. I want the content next to
the sidebar so the content is floated left and the sidebar is floated
right. This looks fine is Firefox and IE but doesn't in Opera ( Opera 6
screenshot - http://www.browsercam.com/projects/171753/3119279.jpg ).

I can't find any reference to any bugs in Opera that would cause it to
behave like this, does anyone have any ideas?

This is the URL of the page template I'm working on:
http://www.pilipala-crafts.co.uk/pilipala/

and this is the URL of the stylesheet:
http://www.pilipala-crafts.co.uk/pilipala/style.css

Thanks

[Lauri Raittila]

in comp.infosystems.www.authoring.stylesheets, Andrew wrote:

I'm developing a site using CSS layout. One of the main divs contains
the content, another contains the side bar. I want the content next to
the sidebar so the content is floated left and the sidebar is floated
right. This looks fine is Firefox and IE but doesn't in Opera ( Opera 6
screenshot - http://www.browsercam.com/projects/171753/3119279.jpg ).
Interesting, this type of layout should work in Opera 6. Only float bug I
remeber is related to boxes that aren't divided by whitespace, but it
shoudl not result something like this. I don't have Opera 6 installed, so
can't say more.

Anyway Opera 6, even if it has better support for CSS2 than IE or FF, is
some old, and 6.0 is not the latest in branch either. I suspect it works
at least in Opera 7 and 8.
I can't find any reference to any bugs in Opera that would cause it to
behave like this, does anyone have any ideas?

AFAIK there is no known bug that causes this kind of effects.
--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Kohtuuhintainen yksiö/huone haussa Oulusta syyskuusta eteenpäin.
Searching places to sleep on axis Bonn - Tsech - Poland - baltic sea in
july

[Spartanicus]

"Andrew" <an*************@gmail.com> wrote:

This looks fine is Firefox and IE but doesn't in Opera ( Opera 6
screenshot - http://www.browsercam.com/projects/171753/3119279.jpg ).

Opera 6 is ancient, rarely used anymore, not worth trying to debug
cosmetic issues.

--
Spartanicus

[Danny]

"Andrew" <an*************@gmail.com> wrote in message
news:11**********************@g14g2000cwa.googlegr oups.com...

I'm developing a site using CSS layout. One of the main divs contains
the content, another contains the side bar. I want the content next to
the sidebar so the content is floated left and the sidebar is floated
right. This looks fine is Firefox and IE but doesn't in Opera ( Opera 6
screenshot - http://www.browsercam.com/projects/171753/3119279.jpg ).

I can't find any reference to any bugs in Opera that would cause it to
behave like this, does anyone have any ideas?

Opera6? That's like worrying about how Internet Explorer 4 displays a page.

The page looks fine in Opera8.01, which is the latest release.

[Lauri Raittila]

in comp.infosystems.www.authoring.stylesheets, Danny@Kendal wrote:

Opera6? That's like worrying about how Internet Explorer 4 displays a page.

No, Opera 6 and even 5 could be used on low end machines quite
reasonably, they work better than IE6 without JS in modern web. There is
currently no security problems in Opera 6 (secunia reports crash bug, but
I wouldn't consider it security problem)

Opera just has gotten more major versions, so it seems that it is old.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Kohtuuhintainen yksiö/huone haussa Oulusta syyskuusta eteenpäin.
Searching places to sleep on axis Bonn - Tsech - Poland - baltic sea in
july

[Andrew]

So back to my original question, does anyone have any idea what's
causing this odd behaviour?

[Lauri Raittila]

in comp.infosystems.www.authoring.stylesheets, Andrew wrote:

So back to my original question, does anyone have any idea what's
causing this odd behaviour?

Almost impossible to say without trying. Could be simple rounding error,
as you do pixel perfect with other units. Try smaller width on right
floated stuff, as it looks it is too wide.
--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Kohtuuhintainen yksiö/huone haussa Oulusta syyskuusta eteenpäin.
Searching places to sleep on axis Bonn - Tsech - Poland - baltic sea in
july

[Danny]

"Andrew" <an*************@gmail.com> wrote in message
news:11**********************@g47g2000cwa.googlegr oups.com...

So back to my original question, does anyone have any idea what's
causing this odd behaviour?

Does the following link help?

http://www.opera.com/docs/specs/opera6/

I've downloaded Opera6 and I'm trying to recreate the problem with a basic
layout but so far everything looks exactly as expected. Humph! Damned
Opera - never breaks when you want it to!

[Lauri Raittila]

in comp.infosystems.www.authoring.stylesheets, Danny@Kendal wrote:

"Andrew" <an*************@gmail.com> wrote in message
news:11**********************@g47g2000cwa.googlegr oups.com...

So back to my original question, does anyone have any idea what's
causing this odd behaviour?
Does the following link help?

http://www.opera.com/docs/specs/opera6/

No, I know Opera 6 far better than that link...
I've downloaded Opera6 and I'm trying to recreate the problem with a basic
layout but so far everything looks exactly as expected. Humph! Damned
Opera - never breaks when you want it to!

So it is most likely rounding error. Note that 1em of width is not always
same as 1em of margin, but 1px bigger or smaller.


--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Kohtuuhintainen yksiö/huone haussa Oulusta syyskuusta eteenpäin.
Searching places to sleep on axis Bonn - Tsech - Poland - baltic sea in
july

[Danny]

"Andrew" <an*************@gmail.com> wrote in message
news:11**********************@g47g2000cwa.googlegr oups.com...

So back to my original question, does anyone have any idea what's
causing this odd behaviour?

Found it! (I think)

Older/some(?) versions of Opera didn't clip overflowed content properly. It
may not have been displayed but it did affect layout. The line height in
#topnav is not necessary. I downloaded a copy of your site, removed the
lineheight from the stylesheet and your page then displayed correctly.

Here is the offending code in your stylesheet.
(best viewed in monospace font)

#topnav { width: 780px;
height: 30px;
HERE----> line-height: 30px;
background: #D5E7FA url(topnav_b.gif) repeat-x;
border-right: 1px solid #FFFFFF;
border-bottom: 1px solid #74A5D7;
margin: 0;
padding: 0;
}

[Andrew]

Fantastic, who would have thought that was the cause?!

Thanks very much for all your hard work on this, and thanks also to
everyone else who offered suggestions :)