html - 如何设置样式的宽度以匹配外部DIV

Question

使用 JQuery 选项卡，我的 div 中有 2 个选项卡，Info & Images

<ul> 的内容包含 2 个选项卡，ul 为蓝色。但是 OnCLickk="ViewFeatureWorkflowImagePostBackBtn_Click"返回一个表。

如果表格的内容比updatePanel width(300)宽，滚动条出现并允许用户查看表格的其余部分，调整更新面板的宽度，因此其余部分不显示蓝色的 ul。

所以 iv 尝试将 ul 的宽度设置为 100%，虽然我会填充外部 div...没有工作...有什么想法吗？

 <asp:UpdatePanel runat="server" ID="UpdatePanel8" UpdateMode="Conditional" ChildrenAsTriggers="true"
           Style="position: relative; overflow: hidden; background-color: White;               
          width: 300px; height: 300px; margin: 5px; text-align: center; outline-style: none; overflow-y: hidden; overflow-x:hidden;">
           <%--width: 500px; height: 450px; --%>

           <ContentTemplate>
                   <div id="DivHolding2Tabs" class="overflowcontent" style="border-color:Black;border-width:1px;border-style:solid;">

                       <ul id="tabList" style="width:inherit;">
                           <li><a href="#tabs-1">Info</a> </li>
                           <li><a href="#tabs-2" style="display:none;">Images</a> </li>

                       </ul>

                       <div id="tabs-1" class="WorkFlowLayout">
                               <b><font color="FF6600">Feature Properties </font></b>
                                <div id="divFeatureInfo" runat="server">
                                </div>
                       </div>

                       <div id="tabs-2" class="WorkFlowLayout">
                                <b><font color="FF6600">Images</font></b>
                                <div id="ImagesRelatingToFeatureDIV" runat="server">  
                               </div>
                       </div>
                   </div>
                   <br />
                   <br />
                   <div class="buttonwrap">
                       <span id="Span5" class="ActionBtns">
                           <asp:Button ID="ViewFeatureWorkflowImagePostBackBtn" runat="server" Style="display: none;
                               visibility: hidden;" OnClick="ViewFeatureWorkflowImagePostBackBtn_Click" />
                       </span>
                   </div>
           </ContentTemplate>
           <Triggers>
               <asp:AsyncPostBackTrigger ControlID="ViewFeatureWorkflowImagePostBackBtn" EventName="Click" />
           </Triggers>
       </asp:UpdatePanel>

Answer 1

在您的 .overflowcontent 中添加一个额外的包装 div。选项卡 div 和 .overflowcontent 不应该相同。

<div class="overflowcontent">
    <div id="DivHolding2Tabs">
        <!-- tabs -->
    </div>
</div>