CSS表格宽度无法设置

时间:2012-08-13 23:49:03

标签: css

2列,几行。 整个表格的宽度似乎设置得很好。没有机会改变它。我所能做的就是移动行分隔符,这样一列就会被拉伸而另一列会扩展。

这是CSS文件。

    body {
    font: normal 11px auto "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    color: #4f6b72;
    background: #E6EAE9;
}

a {
    color: #c75f3e;
}

#mytable {
    width: 450px;
    padding: 0;
    margin: 0;
    height: 39px;
}

caption {
    padding: 0 0 5px 0;
    width: 489px;    
    font: italic 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    text-align: right;
}

th {
    font: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    color: #4f6b72;
    border-right: 1px solid #C1DAD7;
    border-bottom: 1px solid #C1DAD7;
    border-top: 1px solid #C1DAD7;
    letter-spacing: 2px;
    text-transform: uppercase;
    text-align: left;
    padding: 6px 6px 6px 12px;
    background: #CAE8EA url(images/bg_header.jpg)  no-repeat;
}

th.nobg {
    border-top: 0;
    border-left: 0;
    border-right: 1px solid #C1DAD7;
    background: none;
}

td {
    border-right: 1px solid #C1DAD7;
    border-bottom: 1px solid #C1DAD7;
    background: #fff;
    padding: 6px 6px 6px 12px;
    color: #4f6b72;
}


td.alt {
    background: #F5FAFA;
    color: #797268;
}

th.spec {
    border-left: 1px solid #C1DAD7;
    border-top: 0;
    background: #fff url(images/bullet1.gif)  no-repeat;;
    font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
}

th.specalt {
    border-left: 1px solid #C1DAD7;
    border-top: 0;
    background: #f5fafa url(images/bullet2.gif)  no-repeat;;
    font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    color: #797268;
}

这就是表格。

   <table id="mytable" cellspacing ="0">
    <caption>Table 1: Descriptions </caption>
    <tr>
      <th scope="col" abbr="Configurations" class="nobg" style="width: 47px">Configurations</th>
      <th scope="col" abbr="Dual 1.8GHz">Original Stack</th>
    </tr>
    <tr>
      <th scope="row" class="spec" style="width: 47px">Model</th>
      <td class="style1">3xPa</td>
    </tr>
    <tr>
      <th scope="row" class="specalt" style="width: 47px">Year</th>
      <td class="alt" style="width: 181px">1998/A</td>
    </tr>
    </table>

我不确定是什么阻止我改变整个表格的宽度。我已经尝试在#mytable中更改width属性,但它什么也没做。我正在使用VS 2010,aspx webform。

有什么想法吗?

1 个答案:

答案 0 :(得分:1)

在css中更改css中的表格宽度对我来说很好。

尝试删除标题的宽度,标题上的绝对宽度可能会诱使您认为表格大小没有变化......

caption {
    padding: 0 0 5px 0;
    /*width: 489px;  Commented Out */
    font: italic 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    text-align: right;
}