CSS Forum

**phpost** · 12:17 PM

hi friends, i have a problem with border of a div layer. I will post the codes and the screenshot of the problem. The border partially disappear and i couldn't figure out why! Is it another bug of ie6? By the way, if you want to see the problem, you may need to scroll down and scroll up the page so that the half of the comment layer appears. The problem doesn't always occur.

The problem is:

And the html and css code is:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Problem with borders</title>
<style type="text/css">
#all {
    width:500px;
}
#comment {
    border: 3px solid black;
}
#commentleft {
    float: left;
}
#commentright {
    float: right;
    text-align: right;
}
</style>
</head>

<body>
<div id="all">
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<div id="comment">
<div id="commentleft">
<p>left</p>
</div>

<div id="commentright">
<p>right</p>
</div>


<div style="clear: both;"></div>
</div>
</div>

</body>
</html>

**LadynRed** · 07-31-2008, 04:23 PM

It the problem appears when you refresh or scroll up and down, then it sounds like the peek-a-boo bug at work. You can read all about IE6's bugs here:
http://www.positioniseverything.net

**phpost** · 08-01-2008, 11:10 AM

thanks LadynRed,
i read about peek-a-boo bug and i fixed the problem by adding:
position: relative;

Code:

#comment {
    position: relative;
    border: 3px solid black;
}