tags:

views:

21

answers:

0

I have a very simple layout

<div id="1" style="width: 45%">
  <div id="left" style="position:absolute; width: 10px; left: 0px; top: 0px"></div>
  <div id="center" style="position:absolute; left: 10px; right: 10px; top: 0px"></div>
  <div id="right" style="position:absolute; width: 10px; right: 0px; top: 0px"></div>
</div>

Everything works like it should in both IE and Firefox, however, as soon as I switch over to quirks mode, the center div disappears.. I know that's because of the left, right which is not allowed. But I'm trying to come up with a different way of doing this that would work for all modes. I've tried setting width to 100% on the center element and setting margins-left and right on it to 10px, however, in that case left margin works fine, but right one is totally ignored. Any suggestions on how to do this. Also how would you fix the same setup but laid out vertically instead of horizontally (so top, bottom instead of left, right). Thanks.