min-width issue with Chrome

Forum Moderators: not2easy

Message Too Old, No Replies

min-width issue with Chrome

daniel8250

9:14 pm on Aug 10, 2010 (gmt 0)

I want to make a table that will stretch on the top of the page from side to side, and fill page horizontally.

my page has this code for the body


<body> 
  <form>  
  <table class="tblOuterClass" border="0"> 
<tr> 
  <td id="header_tdLogo">
<img id="header_imgLogo" src="images/logo.gif" style="border-width:0px;" />
</td>
    </tr>
  </table>
</body>

and my css is


.tblOuterClass
{
border-collapse: collapse; 
min-width: 100%;
background-color: #f6f6f6;
height:120px;
}

for some reason the IE8 looks fine and so does Mozilla firefox 3.5
How ever Chrome only sets the table width according to the content.

Is there another way to do this so that chrome will work in the same way? even if I use multiple CSS files for different browsers, I have no idea how to do it for chrome.

JevgeniBogatyrjov

12:39 am on Aug 14, 2010 (gmt 0)

Well, all you have to do is to replace

min-width:100%;

with

width:100%;

as far as I can see, it works in all browsers.

I would also probably recommend using divs instead of tables for what you are trying to achieve.