box model, how to solve trouble?

[X t l a n]

Hello.

I wonder, how do you cope with problem of box model arising from quirks
mode and full css compatibility mode? I mean situation, when there is
container, let me say e.g.:
<div style="position:absolute; top:20px;left:20px; height:100px;
width:100px; margin: 3px solid grey></div>

-w3c model says width dimensions doesn't cover margins
-ie model says that width includes margin dimensions as well

How to prepare one stylesheet or/and separate styleshets separately for
ie (quirks mode browsers) and for mozilla (full css compatibility mode
browsers) to provide the same dimensions of container on the assumption
that I want use margin values >0px.

Best regards.

 

[Tonnie]

Hello.

I wonder, how do you cope with problem of box model arising from quirks
mode and full css compatibility mode? I mean situation, when there is
container, let me say e.g.:
<div style="position:absolute; top:20px;left:20px; height:100px;
width:100px; margin: 3px solid grey></div>

-w3c model says width dimensions doesn't cover margins
-ie model says that width includes margin dimensions as well

How to prepare one stylesheet or/and separate styleshets separately for
ie (quirks mode browsers) and for mozilla (full css compatibility mode
browsers) to provide the same dimensions of container on the assumption
that I want use margin values >0px.

Hi Xtlan,

Instead of using the margin on the absolute positioned element you could
place it on a containing element. It usually should fix the problem.

<div style="position:absolute; top:20px;left:20px; height:100px;
width:100px;">
<div style="margin: 3px solid grey;"></div>
</div>

Not tested.


Greetings,

Tonnie

 

[Jonathan N. Little]

Tonnie wrote:

<div style="margin: 3px solid grey;"></div>

^ ^
Also this is not valid for margins, now borders can have 'style' and
'color'.

 

[Tonnie]

Tonnie wrote:


^ ^
Also this is not valid for margins, now borders can have 'style' and
'color'.

Yepp you are right, copy and pasted the whole thing and forgot to remove
the solid grey.