Question

所以我在这里有一点asp：

<asp:Panel runat="server" ID="pnlNavigator" CssClass="panel panel-primary">
    <div class="panel-body" style="width:100%">

        <div style="display:inline-block" >

            <br /><br />
            <div class="container" style="display:inline-block">
                    <asp:TextBox runat="server" Enabled="false" Width="33%" TextMode="MultiLine" Text=" ***Teacher Training, CPD, Mentor Training***">

                </asp:TextBox>
                    <asp:TextBox runat="server" Enabled="false" Width="33%" TextMode="MultiLine" Text="***Sports Science, steps, FMS facilitator***">

                </asp:TextBox>
                    <asp:TextBox runat="server" Enabled="false" Width="33%" TextMode="MultiLine" Text="***Professional Development, Consultant***">

                </asp:TextBox>
            </div>



        </div>
    </div>



</asp:Panel>

基本上他们没有填满整个面板，他们只是到达了大约一半然后开始下面的新线，任何帮助？

Answer 1

Bootstrap .css添加了一个像素::before和::after元素，因此三个textarea的组合宽度超过了100％。

第一个解决方案：将宽度减少1％

<asp:TextBox runat="server" Enabled="false" Width="32%" TextMode="MultiLine" Text="***Sports Science, steps, FMS facilitator***">
</asp:TextBox>

第二个解决方案：使用bootstrap网格系统来控制布局

<asp:Panel runat="server" ID="pnlNavigator" CssClass="panel panel-primary">
    <div class="panel-body">
        <%-- style="width:100%">--%>
        <div class="container-fluid">
            <%-- style="display:inline-block" >--%>
            <%--            <br /><br />--%>
            <div class="row">
                <%-- style="display:inline-block">--%>
                <div class="col-sm-4">
                    <asp:TextBox runat="server" Enabled="false" Width="100%" TextMode="MultiLine" Text=" ***Teacher Training, CPD, Mentor Training***">
                    </asp:TextBox>
                </div>
                <div class="col-sm-4">
                    <asp:TextBox runat="server" Enabled="false" Width="100%" TextMode="MultiLine" Text="***Sports Science, steps, FMS facilitator***">
                    </asp:TextBox>
                </div>
                <div class="col-sm-4">
                    <asp:TextBox runat="server" Enabled="false" Width="100%" TextMode="MultiLine" Text="***Professional Development, Consultant***">
                    </asp:TextBox>
                </div>
            </div>
        </div>
    </div>
</asp:Panel>

无法获取文本框以填充面板

1 个答案: