The blog of Jafar Aliyev

Archive

Creation date:

Internet Explorer bug with tall block

The problem of IE with two containers mentioned in Overflow of inner block article is not solved completely. If the internal container is longer than one screen of browser you'll encounter another problem. Look at this effect

As you can see IE doesn't draw the border of container. U can solve it by giving the background to the parent container. If you don't want the background then paint it to the color of whole page. In this case I added a white background to the above mentioned #content because all page is white. It will force IE to paint whole parent container.

#content{
border: blue 3px solid;
padding: 0.5em;
display:block;
background-color:white;
}

Note that this solution checked only with "-//W3C//DTD XHTML 1.0 Transitional//EN" Document Type Definition. On "-//W3C//DTD HTML 4.01 Transitional//EN" it doesn't work.Therefore If you encounter the same problem change your DTD to <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Author: Jafar N.Aliyev (Jsoft)

Read also

Fixing overflow: hidden in IE

<div> against <table>

Measuring units for padding

Fixed background image

IE bug with first line

Overflow of inner block

The meaning of margin in Internet Explorer and Firefox

CSS hacks
Nowadays many designers give all measures in pixels, including the font sizes. They fit their site to Internet Explorer and...

Height of parent container

© Copyright

All articles in this site are written by Jafar N.Aliyev. Reproducing of any article must be followed by the author name and link to the site of origin(this site). This site also keeps the same rules relative to the articles of other authors.