Jump to content

I can not for the life of me get my colum to change its width.


sepoto
 Share

Recommended Posts

If anyone knows how to get one of these columns to actually change its actual width the way you tell it to I'd love to hear about it.

<tr><td style="width:400px"; overflow:auto;><div style="word-wrap: normal;">North Carolina at Boston College</div></td><td align="left" style="width:100px;"><div style="word-wrap: normal; width: 100px;">6:00PM</div></td><td align="left" style="width:300px;" overflow:auto;><div style="word-wrap: break-word;">723,</div></td></tr>

Link to comment
Share on other sites

always validate your code

<td style="width:400px"; overflow:auto;> should be<td style="width:400px; overflow:auto;">and<td align="left" style="width:300px;" overflow:auto;>  should be<td align="left" style="width:300px; overflow:auto;">

However, in this case the fact that overflow auto is ignored becomes irrelevant since you cannot (yet) control the height of a table cell. so as your cell content grows, it will expand vertically rather than create a horizontal scroll bar.If you must use tables and you want to control their size you can either wait until CSS catches up or you can put a DIV inside each cell (which you have already done) and control the size of the div:

<table><tr><td><div style="width:400px; height:80px;overflow:auto;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sagittis diam ut dui convallis tincidunt. Vivamus facilisis cursus congue. Nunc id felis in ligula interdum varius. Morbi felis justo, volutpat quis pretium quis, interdum sit amet lorem. Suspendisse eu orci enim, vitae congue nibh. Nunc posuere tincidunt hendrerit. Praesent ac long non breaking space element inside the cell long non breaking space element inside the cell.</div></td><td align="left"><div style="word-wrap: normal; width: 100px;">6:00PM </div></td><td align="left"><div style="word-wrap: break-word;">723,</div></td></tr></table>

if you have several cells, it will of course be better to define the divs in the header or in a style sheet....Guy

Edited by Guy Cousineau
Link to comment
Share on other sites

If you must use tables and you want to control their size you can either wait until CSS catches up or you can put a DIV inside each cell (which you have already done) and control the size of the div
But CSS has already caught up. You can force the table to render its cells with fixed sizes by using the table-layout property.
Link to comment
Share on other sites

But CSS has already caught up. You can force the table to render its cells with fixed sizes by using the table-layout property.
Oh yes . . . table-layout I have not played around with. I recall telling someone once that TD width was only a suggestion and that the browser will adjust based on both suggestions and content - how frustrating.However, from what I see, table-layout only affects cell width not cell height. However, this may be the effect Sepoto is seeking.Guy
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...