html css tr set width

Question

I have the HTML table & its CSS.

CSS :

#outerDIV {
  position: relative;
  padding-top: 20px;
}
#innerDIV {
  overflow-y: auto;
  height: 500px;
}
table#mytable tbody tr:first-child 
{
    width:100%;
    position :absolute;
}

HTML :

<div class="outerDIV">
  <div class="innerDIV">
    <table id="#mytable"></table>
  </div>
</div>

I need the fixed header tags of table, so is the above code does, but the width of the th tags gets compressed to the left & does not matches the width of the tr's of the body. How to make the tr to 100% width ?

Check this [link](http://stackoverflow.com/q/16984323/1577396) — Mr_Green, May 16 '15 at 08:42
Provided code is not correct. there is no table with specified ID. — Manish Shukla, May 16 '15 at 08:42
I want first tr i.e. th tags to be fixed. So, cannot remove it. — Harshit, May 16 '15 at 08:45
Maybe you don't need to use `tr` then. Maybe `div` would work better. — Bob, May 16 '15 at 08:46
I cannt remove th's because it gets the width of the other td's & align in the same position. If i use div, then it will mis-aligned — Harshit, May 16 '15 at 08:51

score 0 · Answer 1 · edited May 23 '17 at 11:43

You want the <th> to span the width of multiple columns, but you can't do this with CSS so you need to do it in the HTML (see HTML colspan in CSS).

If you add a colspan attribute to the <th> it should do what you want (see Colspan all columns). If you know the number of columns in the table, use that, e.g. for 5 columns use <th colspan="5">, but you can also use a larger number and it should be ok, e.g. <th colspan="100">.

Some other notes: as others have mentioned, you shouldn't use position on a <tr>. Also, don't include the # in an element id, i.e. it should be

<table id="mytable"></table>

score 0 · Answer 2 · answered May 16 '15 at 09:00

0

NEVER try to use absolute or even relative re-positioning on <tr>, <td> and <th>. It's not supposed to work in tables, and in most cases the results will be nowhere near what you'd expect.

answered May 16 '15 at 09:00

connexo

53,704
14
91
128

html css tr set width

2 Answers2