Frustration with IE 6

It has been a frustrating day trying to deal with the CSS bugs in Internet Explorer. This site shows up nicely in Firefox, Safari and other browsers using CSS style sheets to handle the display. However if you're looking at this site in Internet Explorer 6 the sidebar doesn't show up. The bmannconsulting.com site has the same problem (and is another Drupal site). Is there something in the default Drupal .css that causes this or is it some oddity of IE we're left to battle on our own. It might be necessary to re-design the CSS with the advice from webreference.com. Something to do this evening I guess.

Category: 

8 Comments

It's IE

I should probably look into fixing that, but I'm fooling with a new design in any case that should be more cross-browser friendly.

David Shea CSS talk slides

ActiveState recently hosted a talk by David Shea, CSS guru and the dude behind the CSS ZenGarden. You might want to check out the slides:

http://mezzoblue.com/presentations/2005/vanxml/

later in the slides he talks specifically about overcoming browser issues. You might also want to use his css default values reset file:

http://mezzoblue.com/presentations/2005/vanxml/css/formathtml.css

Try StyleMaster

It is a CSS editor with supposedly one of the best references to CSS. Better, it shows how your CSS works with various browsers:
http://www.westciv.com/

Note: I don't have any interest in the company. I am just a fellow drupal user trying to help.

Gagging IE 6

Have you tried something like this:

{
width: 200px;
float: left;
margin-left: 15%;
padding: 15px 0 0 15px;
font-size: 0.9em;
line-height: 1.5em;
}

I have had similar problems with IE. I am not sure if the above would work, but with IE, you never know. There doesn't seem to be a method to it's madness. Let me know if you find a fix.

RE: Gagging IE 6

On my previous comment, I added some code....
I checked IE 6 on my PC and the right sidebar () is at the bottom.

Try adding display: inline; at the end of the previous code I sent you.

Let me know if that works. I hope that helps.

Thanks for all the great suggestions

It seems to be working now if the window is large enough. I'll have to tinker a bit more to see where the magic is. I'll be trying these suggestions and will report back.

Less than ideal

Well I seem to have found a compromise that is less than ideal. The right column is fixed with an absolute position. This doesn't break in other browsers and by reducing the left margin on the column it displays OK in IE 6. However, when the page gets too narrow the columns bleed together. I had another idea that was a non-absolute column but it led to a poor looking page in standards compliant browsers.

Looks interesting

Thanks! I'll give it a demo and see what I think. The screenshots look promising.