Most of the pages on my site are in a 3-column layout. For the pages that needed 2 columns, I'm relying on panels because I didn't have the time to get into the templating files and how to make new template files and use them for only certain type of pages.

My problem is in Zen-based 3-column layout, the middle content <div> has a 515 pixels width. The total width of the big centered wrapper is 960 pixels. The <div>s that hold it are "#content" and "#content-inner." These <div>s are squeezing my 2-column panels in Internet Explorer.

I realize this problem is mainly due to my lame workaround and poor understanding of how CSS truly works, rather than Internet Explorer. What I did basically is a <div> of which "#content-inner" is the parent, and I made it 960-pixel wide; so Chrome and Firefox will "understand" me, and prioritize that child-<div> that is generated by Panels and have it be 960-pixel wide.

Internet Explorer won't do this for me. Bummer. Yet, I don't know how to go about solving this without having to rebuild everything.

  • 1
    It is possible that you are running into the IE 31 stylesheet limit. Turn on CSS optimization, clear cache, and see if that helps. Otherwise, you really have a HTML/CSS issue and not a Drupal specific issue, which is a better question for the primary SO site. – mpdonadio Sep 26 '11 at 13:37
  • Sorry for late response was on holiday. Was just to say that it did the trick. Thought I couldn't possible be at the 31 limit already but there you go :-) – Immers Oct 6 '11 at 9:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.