ozsenegal
ozsenegal

Reputation: 4133

Maintain table width fixed

I have a table with dynamic data.

Depending on data, it expands or collapses.

I don't want it. I want a fixed width that never expand or collapse.

How can I do that?

I've already tried <table width="300px"></table>, but it doesn't work.

Upvotes: 6

Views: 21744

Answers (3)

Dave Markle
Dave Markle

Reputation: 97671

You'd set the width of each column explicitly like so:

td.a {
   width:100px;
}
td.b { 
   width:200px;
}
...

<table>
<tr><td class='a'>A</td><td class='b'>B</td></tr>
<tr><td class='a'>A</td><td class='b'>B</td></tr>
<tr><td class='a'>A</td><td class='b'>B</td></tr>
<tr><td class='a'>A</td><td class='b'>B</td></tr>
</table>

Upvotes: 0

ironsam
ironsam

Reputation: 630

The following should work:

<table style="width:300px;table-layout:fixed"></table>

Upvotes: 13

Johan
Johan

Reputation: 5053

Either old ugly way

<table width="300"></table>

or the CSS way

<table style="width:300px"></table>

Of course, the best way is to use a separate stylesheet file, call it for example style.css:

table {
  width: 300px;
}

and your html document:

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="style.css"/>
  </head>
  <body>
    <table>
    ...
    </table>
  </body>
</html>

Upvotes: -1

Related Questions