css table column width not set

Posted by bsreekanth on Stack Overflow See other posts from Stack Overflow or by bsreekanth
Published on 2010-05-26T04:31:36Z Indexed on 2010/05/26 4:41 UTC
Read the original article Hit count: 455

Filed under:

Hello,
I'm trying to set the width of table column to a minimum value. The header row (th) was set white-space:nowrap to prevent wrapping. Now all the columns (including td rows) set to a width that of th. I tried to expand the size of smaller columns by setting it in the html as
<th style="width:200px;"> and <td style="width:200px;">, but it has no effect. In firebug, in the style section, the width setting is active

element.style  {
width:200px;
}

Still, the computed tab shows the width is less than 200px. Please see the details below.

th -- computed:

Text
font-family verdana,arial,helvetica,sans-serif
font-size   10px
font-weight bold
font-style  normal
color   #333333
text-transform  none
text-decoration none
letter-spacing  normal
word-spacing    0
line-height 17px
text-align  left
vertical-align  baseline
direction   ltr
Background
background-color    transparent
background-image    none
background-repeat   repeat
background-position 0 0
background-attachment   scroll
opacity 1
Box Model
width   152px
height  17px
top auto
right   auto
bottom  auto
left    auto
margin-top  0
margin-right    0
margin-bottom   0
margin-left 0
padding-top 0
padding-right   0
padding-bottom  0
padding-left    0
border-top-width    0
border-right-width  0
border-bottom-width 0
border-left-width   0
border-top-color    #333333
border-right-color  #333333
border-bottom-color #333333
border-left-color   #333333
border-top-style    none
border-right-style  none
border-bottom-style none
border-left-style   none
Layout
position    static
display block
visibility  visible
z-index auto
overflow-x  visible
overflow-y  visible
white-space nowrap
clip    auto
float   none
clear   none
-moz-box-sizing content-box
Other
cursor  pointer
list-style-image    none
list-style-position outside
list-style-type disc
marker-offset auto

and td --computed:

Text
font-family verdana,arial,helvetica,sans-serif
font-size   11px
font-weight 400
font-style  normal
color   #222222
text-transform  none
text-decoration none
letter-spacing  normal
word-spacing    0
line-height 12px
text-align  left
vertical-align  top
direction   ltr
Background
background-color    transparent
background-image    none
background-repeat   repeat
background-position 0 0
background-attachment   scroll
opacity 1
Box Model
width   152px
height  48px
top auto
right   auto
bottom  auto
left    auto
margin-top  0
margin-right    0
margin-bottom   0
margin-left 0
padding-top 5px
padding-right   6px
padding-bottom  5px
padding-left    6px
border-top-width    0
border-right-width  1px
border-bottom-width 0
border-left-width   0
border-top-color    #222222
border-right-color  #222222
border-bottom-color #222222
border-left-color   #DDDDDD
border-top-style    none
border-right-style  none
border-bottom-style none
border-left-style   solid
Layout
position    static
display table-cell
visibility  visible
z-index auto
overflow-x  visible
overflow-y  visible
white-space normal
clip    auto
float   none
clear   none
-moz-box-sizing content-box
Other
cursor  auto
list-style-image    none
list-style-position outside
list-style-type disc
marker-offset   auto

Any help, highly appreciated... thanks

© Stack Overflow or respective owner

Related posts about css