Does anyone happen to know if it is possible to create a layout that will allow me to have a fixed width left column and fluid right/content column? The really tricky thing, is that I'm in a CMS. I cannot add inner/outer divs to contain the modules. I have to work with what I have, which is a LeftColumn ContentColumn. I've looked around online, but I could only find solutions that I wouldn't be able to implement because of being inside the CMS. I'm sure I'm not doing a good job at explaining this, so if anyone needs some clarification, just let me know! I've actually came up with a couple of partial solutions myself, but the problem that I keep running into is that it'll either work on Firefox or IE, not both. I came up with one solution that would work on both, but not on IE 6. The three major browsers of our customers are Firefox 2.0+, IE 6.0+ and Safari 525+. Did I mention that IE sux! Why they haven't started to become CSS compliant until recently is beyond my comprehension...
Sorry I don't mean to bump this thread. I just forgot to include some of my HTML to get an idea of what I have to work with: <table width='100%' class="Layout" cellpadding="0" cellspacing="0"> <tr> <td> <table cellpadding=0 cellspacing=0 border=0 width="100%"> <tr> <td class="LayoutTop"><div style='clear:both;width:;' id='LayoutControlContainer120'><table width="100%" border="1"><tr><td>This is a test of the header</td></tr></table> </div> </td> </tr> <tr id="trHorizontalNav"> <td></td> </tr> <tr> <td valign="top" align=center> <table cellpadding="0" cellspacing="0" class="LayoutMiddle"> <tr> <td id="ctl06_tdLeftColumn" valign="top" style="width: " Class="LayoutLeftColumn"> <div style='clear:both;width:;' id='LayoutControlContainer119'><style><!--[if IE]> .LayoutLeftColumn { width:40%;<![endif] } --> </style> <table width="100%" bgcolor="#eeeeee" style="padding:5px; border:solid 1px #CCCCFF"> <tr> <td> Your Account: <a href="https://trossenrobotics.americommerce.com/store/myAccount.aspx"> Alex</a> | <a href='/store/logout.aspx'>Logout</a><br/> </td> </tr> </table> <table width="100%" style="padding: 2px 5px;" bgcolor="#C0C0C0"><tr><td><span Class='ShopCartLine'><a Class='ShopCartLine' href='/store/ShopCart.aspx'>2 Item(s)</a> ( $689.95 )</span></td></tr></table> </div><div ID='dvWrapControl118' style='clear:both;width:100%;'><div id="ctl06_ctl01_ctl00_dvControl" class="Control"> <div id="ctl06_ctl01_ctl00_dvControlHeader" class="ControlHeader">Search:</div> <div id="ctl06_ctl01_ctl00_panSearch" onkeypress="javascript:return WebForm_FireDefaultButton(event, 'ctl06_ctl01_ctl00_btnSearch')"> <input name="ctl06$ctl01$ctl00$txtSearchBox" type="text" id="ctl06_ctl01_ctl00_txtSearchBox" class="ControlInput" /> <input type="image" name="ctl06$ctl01$ctl00$btnSearch" id="ctl06_ctl01_ctl00_btnSearch" src="/store/buttons/Theme5/btnGo.gif" align="absmiddle" style="border-width:0px;" /> </div> <div id="ctl06_ctl01_ctl00_dvControlFooter" class="ControlFooter"></div> </div> </div> </td> <td valign="top" style='width:0' class="LayoutContent"> <div class="LayoutMiddleBreadcrumbs"></div> <div class="LayoutMiddleMessage"></div> <div class="LayoutMiddleBody"> <div style='clear:both;width:;' id='LayoutControlContainer112'><table width="100%" border="1"><tr><td>This is a test</td></tr></table></div> </div> <div class="LayoutMiddleBottom"></div> </td> </tr> </table> </td> </tr> <tr> <td> <div class="LayoutBottom"><table width="100%" border="1"><tr><td>This is a test of the footer</td></tr></table></div> </td> </tr> </table> </td> </tr> </table> HTML: I had to dig this out of my full HTML page, so if you think I'm missing something, just let me know. Sorry, but the CSS file itself is a little "inaccessible", because of it being within a CMS and the fact that these pages aren't live.