Question

我尝试在fieldset中放置一个表，其中表已修复width 2200px，表父（div）具有css属性overflow-x: auto; width: 100%

这样的结构：

fieldset:
    div:
       table:

但div的滚动没有显示，我该如何解决这个问题呢？

jsBin：http://jsbin.com/sazogamiha/edit?html,css,output

Answer 1

您可以使用width: 100vw;代替width: 100%;。

Jsbin

#pai {
    width: 100vw;
    overflow-x: auto;
    float: left;
    white-space: nowrap;
}

或者您必须将min-width: 0;提交给fieldset。 fieldset默认为min-width: -webkit-min-content;，因此您可以覆盖它。

fieldset {
    width: 100%;
    min-width: 0;
}

Jsbin

Answer 2

您是否可能使用逗号（“，”）而不是分号（“;”）来分隔css属性？

关于宽度。某些标记不适合您的问题，其中一个是fieldset

试试这个

<div class="wrapper">
    <div class="container">
      <fieldset>
        <table>
          <tr>
            <td>...</td>
          </tr>
        </table>
      </fieldset>
    </div>
</div>

这个CSS

div.wrapper {
  width: 100%;
}
div.container {
  overflow-x: auto; 
  width: 90%;
}
table {
  width: 2000px;
}
table td {
  border: 1px solid black;
}

字段集中的表溢出不起作用

2 个答案: