1 reply [Last post]
sionvalais
Offline
Regular
Last seen: 16 years 15 weeks ago
Joined: 2003-06-06
Posts: 49
Points: 0

I want my 'columns' in the table to have a fixed (rigid) width, independent of the content.
How is this to be done?

cheers,

Mark

css:
<style>
#sv {
width:930px;
margin-right:auto;
margin-left:auto;
margin-top:5px;
padding:0px;
text-align:center;
}

/* tableless tables */

div.tableless {
width: 450px;
background-color:#fff;
border: 0px dotted #fff;
padding: 5px;
margin: 0px auto;
}

div.row {
clear: both;
padding-top: 10px;
}

div.row span.col1 {
float: left;
width: 100px;
text-align: right;
}

div.row span.col2 {
float: right;
width: 200px;
text-align: left;
}
</style>

html:

<div id="sv">
<div class="tableless">

<div class="row">
<span class="col1">col1111111111111111111111111111111111111111</span>
<span class="col2">field111111111111111111111111111111111111111</span>
</div>

<div class="row">
<span class="col1">col1</span>
<span class="col2">field</span>
</div>

<div class="row">
<span class="col1">col1</span>
<span class="col2">field</span>
</div>

<div class="row">
<span class="col1">col1</span>
<span class="col2">field</span>
</div>

<div class="row">
<span class="col1">col1</span>
<span class="col2">field</span>
</div>

<div class="spacer">
&nbsp
</div>

</div>
</div>

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 2 days 2 hours ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5342
Points: 2963

css tables fixed width columns

Hi sionvalais,
Have you tried using overflow set to hidden or scroll on col1 and col2.

Hope that helps