Topic: The minium height bug in IE... (Page 1 of 1) $Pages that link to <a href="https://ozoneasylum.com/backlink?for=10973" title="Pages that link to Topic: The minium height bug in IE... (Page 1 of 1)" rel="nofollow" >Topic: The minium height bug in IE... <span class="small">(Page 1 of 1)</span>\$

Rinswind 2th Maniac (V) Inmate From: Den Haag: The Royal Residence Insane since: Jul 2000	posted 05-16-2003 23:45 I think IE has a little bug which shows layers too high when you set the height realy small, less than 5pixels. Look at this Picture: wrong This one is made with this code: code: <html> <head> <title>minimium height</title> <style type="text/css"> #divCursor{ position:absolute; width:6px; height:6px; background-color:#ff0000; display:block;} #menu{ position:absolute; width:4px; height:4px; background-color:#00ff00; display:block; } </style> </head> <body> <div id="divCursor"> <div id="menu"></div> </div> </body> </html> Now look at this picture: Good The code is the same there is just an div extra. Thus: code: <div id="divCursor"> <div id="menu">[b]<div></div>[/b]</div> </div> I played with different units like em, pt, and px first before i found this. BTW it's in IE6 for windows. __________________________________________ "Art has to be forgotten. Beauty must be realized." Piet Mondriaan [This message has been edited by Rinswind 2th (edited 05-17-2003).]
u-neek Bipolar (III) Inmate From: Berlin, Germany Insane since: Jan 2001	posted 05-17-2003 09:17 I had similar problems with some layouts. Try to add a font-size: 1px. #divCursor{ font-size: 1px;position:absolute; width:6px; height:6px; background-color:#ff0000; display:block;} #menu{ font-size: 1px;position:absolute; width:4px; height:4px; background-color:#00ff00; display:block; }
HZR Bipolar (III) Inmate From: Cold Sweden Insane since: Jul 2002	posted 05-17-2003 13:49 Or try overflow: auto; or overflow: hidden on the div with the greean bg.
smonkey Paranoid (IV) Inmate From: Northumberland, England Insane since: Apr 2003	posted 05-17-2003 17:57 some problems like this can be to do with empty tags, so try putting something between the div tags like: <div id="divCursor"> <div id="menu"> </div> </div> or <div id="divCursor"> <div id="menu"> </div> </div> Sometimes it's best to make a spacer div that you can chuck in anywhere like this, it also sloves problems with floats having no height when they are contained within a div that is smaller than itself. A spacer div is just a div with it's style set to clear:both - it fixes most situations when nested divs behave strangely. visit my CryoKinesis Online Gallery
Rinswind 2th Maniac (V) Inmate From: Den Haag: The Royal Residence Insane since: Jul 2000	posted 05-18-2003 11:11 It's not realy a problem off nested div's. Although it looks like it in my first post. But if you remove the 'menu' and the inner div, thus leaving the 'divCursor' div this too will be too high in Internet Explorer. In both Opera7 and Netscape7 it looks good. I hate to use workarounds only to please a non standard compliant browser..... Anyway thanks guys for the responses and the workarounds __________________________________________ "Art has to be forgotten. Beauty must be realized." Piet Mondriaan

Topic: The minium height bug in IE... (Page 1 of 1) $Pages that link to <a href="https://ozoneasylum.com/backlink?for=10973" title="Pages that link to Topic: The minium height bug in IE... (Page 1 of 1)" rel="nofollow" >Topic: The minium height bug in IE... <span class="small">(Page 1 of 1)</span>\$

Rinswind 2th
Maniac (V) Inmate

From: Den Haag: The Royal Residence
Insane since: Jul 2000

posted 05-16-2003 23:45

I think IE has a little bug which shows layers too high when you set the height realy small, less than 5pixels.
Look at this Picture:

wrong

This one is made with this code:

code:

<html>

<head>

  <title>minimium height</title>

  <style type="text/css">

#divCursor{

	position:absolute; width:6px; height:6px;

	background-color:#ff0000; display:block;}



#menu{	

	position:absolute; width:4px; height:4px;

	background-color:#00ff00; display:block;

}

  </style>

</head>

<body>

<div id="divCursor">

<div id="menu"></div>

</div>

</body>

</html>

Now look at this picture:

Good

The code is the same there is just an div extra.
Thus:

code:

<div id="divCursor">

<div id="menu">[b]<div></div>[/b]</div>

</div>

I played with different units like em, pt, and px first before i found this.
BTW it's in IE6 for windows.

__________________________________________
"Art has to be forgotten. Beauty must be realized."
Piet Mondriaan

[This message has been edited by Rinswind 2th (edited 05-17-2003).]

u-neek
Bipolar (III) Inmate

From: Berlin, Germany
Insane since: Jan 2001

posted 05-17-2003 09:17

I had similar problems with some layouts. Try to add a font-size: 1px.

#divCursor{
font-size: 1px;position:absolute; width:6px; height:6px;
background-color:#ff0000; display:block;}

#menu{
font-size: 1px;position:absolute; width:4px; height:4px;
background-color:#00ff00; display:block;
}

HZR
Bipolar (III) Inmate

From: Cold Sweden
Insane since: Jul 2002

posted 05-17-2003 13:49

Or try overflow: auto; or overflow: hidden on the div with the greean bg.

smonkey
Paranoid (IV) Inmate

From: Northumberland, England
Insane since: Apr 2003

posted 05-17-2003 17:57

some problems like this can be to do with empty tags, so try putting something between the div tags like:

<div id="divCursor">
<div id="menu"> </div>
</div>

or

<div id="divCursor">
<div id="menu"> </div>
</div>

Sometimes it's best to make a spacer div that you can chuck in anywhere like this, it also sloves problems with floats having no height when they are contained within a div that is smaller than itself.

A spacer div is just a div with it's style set to clear:both - it fixes most situations when nested divs behave strangely.

visit my CryoKinesis Online Gallery

Rinswind 2th
Maniac (V) Inmate

From: Den Haag: The Royal Residence
Insane since: Jul 2000

posted 05-18-2003 11:11

It's not realy a problem off nested div's.
Although it looks like it in my first post.
But if you remove the 'menu' and the inner div, thus leaving the 'divCursor' div this too will be too high in Internet Explorer. In both Opera7 and Netscape7 it looks good.
I hate to use workarounds only to please a non standard compliant browser.....
Anyway thanks guys for the responses and the workarounds

__________________________________________
"Art has to be forgotten. Beauty must be realized."
Piet Mondriaan

Post Reply

Your User Name:
Your Password:
Login Options:	Remember Me On This Computer

Your Text: Insert Slimies » Insert UBB Code » Close Last Tag \| All Tags UBB Help	Loading...
Options:	Show Signature Enable Slimies Enable Linkwords

Topic: The minium height bug in IE... (Page 1 of 1)

Insert Slimies »

Insert UBB Code »