asp.net - CSS溢出自动不起作用

Question

这是结构

<div>
  <fieldset>
    <asp:panel runat="server">
      <asp:Gridview runat="server">
      </asp:Gridview>
    </asp:panel>
  </fieldset>
</div>

我希望 div、字段集和面板宽度保持不变。当网格中的列增加时，面板应该会出现一个滚动条。我无法弄清楚。面板和网格超出了字段集。

http://jsfiddle.net/FksxS/12/

Answer 1

给宽度属性一个值..!!

 <asp:Panel runat="server style="overflow-x:auto;width:760px">

编辑：如果你需要给 width:100% 然后做

<asp:Panel runat="server style="overflow-x:auto;width:100%">



     .fieldset
        {
            border:1px solid gray;
            border-radius:5px;
            overflow-x:auto;
        }
        .div
{
    border:1px solid red;
    padding:5px;
    overflow-x:auto;
    width:100%;
}

最新 的 jsfiddle-根据需要工作的 css

Answer 2

为了使您的财产overflow:auto正常工作，请尝试设置 amax-width或widthfix

<asp:Panel runat="server style="width:100%; max-width:100%; overflow-x:auto;">

编辑

在审查了您的代码后，我终于明白了问题所在，默认情况下，它已被分配min-width给您fieldset适合他的内容。然后除了定义之外，width我还max-width设置了一个min-width

.fieldset
 {
  display:block;
  width:93%;
  max-width:93%;
  min-width:0%;
  border:1px solid gray;
  border-radius:5px;
  padding:2%;
  overflow-x:hidden;
 }

检查演示http://jsfiddle.net/FksxS/29/

PD：还要注意宽度padding，border让它增加。或使用box-sizing.