I was working on a theme, which had the following structure:

<div class1></div>
<div class2></div>
<div class3>content</div> 
<div class4> </ ... 

class1 sits on the top and class3 has an image with content.

Now, the stuff worked very good in Firefox, Opera, and even IE 8. But IE 6 did not render the top of the border correctly, and ended up showing only a small dot at the top. When I looked at Drupal.org, I found a few replies, which had various interesting options:

  1. Increase the width to the size of the image, so it will stretch. This was a good option, but again I found it less efficient, as it would render my class1 limited.
  2. Put a height tag of 1 %. IE is notorious in that field. Tried but it didn't work.
  3. Put a font-size: 1px;. It worked!

In the class, class 2, just add a new tag:
.class 2 , .class 4 { font-size: 1px; }

It worked wonders as if nothing was ever wrong. IE 7+ is happy now.

Final Word: In case you are looking for an IE 6 fix, then solution 1 will possibly be helpful.