Search code examples
htmlcssmarginopera

margin-bottom is calculated differently in Opera

I have a div with relative position and a children div with position absolute.

<div id="container" class="out">
    <div id="inside"></div>
</div>

CSS:

#container {
    width:100px;
    height:100px;
    position: relative;
}
#inside {
    position:absolute;
    top:25px;
    left:25px;
    right:25px;
    bottom:25px;
    margin-bottom:24px;
}

Chrome, Safari and Firefox seem to work correctly but Opera browser (in Mac) is calculating margin-bottom twice.

This a fiddle: http://jsfiddle.net/4fw9wc0o/1/

Is this a bug or am I missing some property?

Solution

  • Seems like the Opera browser offered in the App Store is version 12, more than a year and a half outdated (actual is 25). Downloading it directly from their website and opening the jsfiddle doesnt show any conflict.