CODEWITHSUNDEEP
csslayoutoperacss-float
i_like_robots
i_like_robots

Reputation: 2787

Calculation of element widths when floated in Opera 11.*

I'm dealing with an issue in the Opera 11.5 beta (I am presuming this is relevant to all Opera 11 releases) whereby a floated, block-level element (an un-ordered list) is being given an arbitrary fixed width and causing the child elements to wrap - in the same way to IE6 does.

The element is floated right and currently has no siblings. There are no widths specified for lists in my stylesheet.

I was wondering what sort of logic Opera uses to calculate width in these instances?

I have uploaded an image comparing Opera 11.5 to Firefox 4.1 with Dragonfly/Firebug output.

http://twitpic.com/55f79o/full

jsFiddle: http://jsfiddle.net/i_like_robots/HKAQ9/

Upvotes: 0

Views: 281

Answers (2)

Shabbir Bhimani
Shabbir Bhimani

Reputation: 19

According to me it is a bug in Opera.

When calculating the width of an element it calculates based on the sum total of all the width of child elements but if you have 2 Div elements as child displaying as block elements actually the width is not sum total of both the elements.

To fix the issue all you have to do is specify the width of the parent element instead of allowing Opera to calculate.

@clairesuzy - You can see the bug in action with the code I have posted here http://www.go4expert.com/forums/showthread.php?t=27000

Upvotes: 2

clairesuzy
clairesuzy

Reputation: 27624

I don't know why yet (will look later)

but Opera is not liking the replace class not having a width on it

.replace {
    display:block;
    overflow:hidden;
    text-indent:-9999px;
    background: no-repeat 0 0;
    width: 10px;
}

I presume that class(by it's name) is to house a replacement background image, so it should be OK to put a width on it?

Updated it is connected to the text-indent method of text hiding - without the text indent it is also fine in Opera

Upvotes: 1

Related Questions