CODEWITHSUNDEEP
htmlcss
matrixguy
matrixguy

Reputation: 306

chaging width of one column css

Here's my css properties for a table. I want to fix the width of a certain column and hide the overflow. I tried on all the columns but i can't seem to make it work.

.celltable2 table {
table-layout:fixed;
font-family: Helvetica, Arial, sans-serif;
width: 640px;
border-collapse:
collapse; border-spacing: 0;
}

table.celltable2 td, th {

border: 1px solid transparent;
width: 30px;
height: 30px;
transition: all 0.3s; 
overflow: hidden;
}

table.celltable2 td {

text-align:center; 
    vertical-align:middle;
}

Is there something i might be missing?. I tried defining colgroup and colspan but no success.

Upvotes: 0

Views: 49

Answers (1)

Gaurav Aggarwal
Gaurav Aggarwal

Reputation: 10197

The problem is with your this css

table.celltable2 td, th {
  border: 1px solid transparent;
  width: 30px;
  height: 30px;
  transition: all 0.3s; 
  overflow: hidden;
}

In this you have targeted the width of <td> but not the <th> as after , you need to define like this table.celltable2 th instead of just th.

This is correct

table.celltable2 td, table.celltable2 th {
  border: 1px solid transparent;
  width: 30px;
  height: 30px;
  transition: all 0.3s; 
  overflow: hidden;
}

Upvotes: 2

Related Questions