100% and firefox

[zeidhaddadin]

Hi all, I'm using this css:<code>p {font-family : verdana;font-size : 12px;margin : 1em 0;}.p1 {font-size : 11px;text-align : center;}.p2 {text-align : center;}table {width : 100%;}.td1 {height : 25px;background-color : #F6F6F6;margin : 1em 0;}.td2 {width : 550px;height : 20px;text-align : justify;margin : 1em 0;}a:link, a:active, a:visited {color : #0000FF;}a:hover {color : #567CBA;}</code>There is an attribute "table" which have a width 100%And In .td2 I have width : 550px;(So in other td's classes the width is 100% (by default) but with td2 its only 550px ..)This is working fine in IE but with firefox it's ignoring the 550px and showing it as 100%...Is there anyway to fix this,Thanks very much,zeid

[aspnetguy]

can you post the HTML aswell?

[zeidhaddadin]

It includes asp.net code:<p class="p2"><br /></p><table cellpadding="0" cellspacing="0" border="0"><tr><td class="td1"> </td></tr><tr><td class="td2"> </td></tr></table><form runat="server"><asp:Repeater id="Table" runat="server"><HeaderTemplate><table cellpadding="0" cellspacing="0" border="0"></HeaderTemplate><ItemTemplate><tr><td class="td2"><p><a href="<%#Container.DataItem("url")%>"><%#Container.DataItem("url")%></a></p><p><%#Container.DataItem("desc").Replace(search,"<b>" & search & "</b>")%></p></td></tr></ItemTemplate><FooterTemplate></table></FooterTemplate></asp:Repeater></form><table cellpadding="0" cellspacing="0" border="0"><tr><td class="td2"> </td></tr><tr><td class="td1"> </td></tr></table><p class="p1">© 2007, <a href="INDEX.aspx">HOME PAGE</a> - Powered by <a href="http://www.ze1d.com/">ze1d</a></p></body>

[aspnetguy]

the middle block, I assume is were your problem is, only has one column. It will take 100% of the width of the table.

[zeidhaddadin]

what do u mean one column!?

[aspnetguy]

in this block

<form runat="server"><asp:Repeater id="Table" runat="server"><HeaderTemplate><table cellpadding="0" cellspacing="0" border="0"></HeaderTemplate><ItemTemplate><tr><td class="td2"><p><a href="<%#Container.DataItem("url")%>"><%#Container.DataItem("url")%></a></p><p><%#Container.DataItem("desc").Replace(search,"<b>" & search & "</b>")%></p></td></tr></ItemTemplate><FooterTemplate></table></FooterTemplate></asp:Repeater></form>

you only have 1 set of <td></td> (1 column).I only see a <td class="td2"></td> not a td1 like in the above and below blocks.

[zeidhaddadin]

all have one column only ... but both the first and last block have 2 rows ... but they are all the same

[falcifer]

all have one column only ... but both the first and last block have 2 rows ... but they are all the same

I think what the problem is that when you create a table, the then contents are set to fill the space.e.g. if the table width is 100%, then the columns will fill that width too. So if you only have one column, then it expands to fill the 100%In the other cases, where you have two columns, on of them is set to 550px, and the other automatically fills the empty space.The solution would be to put in an extra empty column to fill up the empty space after resizing the td2 to 550pxIf you think about it, you're setting a table to 100%, and then asking that the column only take up 550px... which leaves some rather ambiguous space. Does it treat it as a border? Padding? Another cell?Personally, I think Firefox is right about how it renders the table like that.And if all the columns in that middle table are of the same class, then maybe you should just make the table 550px wide.If you need the table to take up 100% of the page, then put it inside a container that fills 100% of the width.