Solved

CSS border redraw problems in IE 6

Posted on 2004-10-06
3
441 Views
Last Modified: 2008-02-01
Howdy again,

I have a rather large page, which seems to work reasonably well.  However, there is just one bug that i can't seem to find the cause yet.

Most browsers have no problems, but in Internet Explorer 6, it has difficulty with a wide border near the bottom of the page.

If you load it up in say Firefox, the bottom page total line has a 10px high border in a dark blue colour.  However, if you load the page in IE, it has some redraw issues.  be default you wont be able to see the border at all.  But if you click the little "plus" icons on each panel on the right hand side and collapse a number of them down.   sometimes the border will show.  

This seems to be a redraw problem as far as i can tell.  Anybody here got an understanding of what i should be looking for to fix?

http://www.zyotism.com/MDSWORK/Analyser5/061004/invoiceview.html
http://www.zyotism.com/MDSWORK/Analyser5/061004/css/analyser.css


Cheers
0
Comment
Question by:M_Corkish
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
3 Comments
 
LVL 5

Expert Comment

by:php-webdesign
ID: 12235807
try setting a max-heigt / max-width, bacause IE and FIREFOX render the width differently (because of the cell-padding etc..)
0
 
LVL 19

Accepted Solution

by:
dakyd earned 125 total points
ID: 12245839
I think you just discovered the "Peek-A-Boo" bug, my friend.  In this case, you can apply a set width, so a quick fix would be to change your CSS for .pageTotalRow to this:

.pagetotalRow {
border-top: 10px solid #00689C;
padding-bottom: 15px;
width: 100%;
}

Since you want the div to stretch across the entire bottom anyway, width: 100% shouldn't change the layout.  However, it'll fix your "sometimes appears, sometimes doesn't" bug in IE.  It's strange, I know, but you can check out http://www.positioniseverything.net/explorer/peekaboo.html for a bit of an explanation on it.  Either way, hope that helps.
0
 

Author Comment

by:M_Corkish
ID: 12306233
Sorry about the delay getting back to this question. I got pulled off the project for a few weeks.   Thanks for the heads up on the "peak-a-boo" bug.  looks like thats the culprit! ;-)

Cheers
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

707 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question