Question

我在另一个引导程序面板中有一个嵌套的引导程序面板（见图）。如何使面板拉伸到父面板的宽度？为了澄清，我不希望嵌套面板是它的父级的宽度，而是从它开始的任何地方伸展到父面板的宽度。

所以，如果你看一下图像，我希望面板向右伸展（它的宽度几乎是父面板的一半）。

如果我要缩小屏幕尺寸的宽度，那么面板应该低于图表（它当前所做的那样），然后伸展到右侧。

这是我的代码：

       <div class="panel panel-primary" style="border-color: #464646;">
            <div class="panel-heading" style="border-color: #BBBBBB; height: 35px; padding-top: 3px;">
                <div style="float: left; margin-top: 5px;">Chart</div>
            </div>

            <div class="panel-body">
                <!--Chart-->
                <div style="display: inline-block;">
                    <canvas id="myChart" width="325" height="325"></canvas>
                </div>

                <!--Panel to Stretch-->
                <div style="display: inline-block; vertical-align:top;">
                    <div class="panel panel-primary" style="border-color: #464646;">
                        <div class="panel-heading" style="border-color: #BBBBBB; height: 35px; padding-top: 3px;">
                            <div style="float: left; margin-top: 5px;"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

Answer 1

如何为图表和嵌套面板提供列类？看起来对我好：

    <div class="panel panel-primary" style="border-color: #464646;">
        <div class="panel-heading" style="border-color: #BBBBBB; height: 35px; padding-top: 3px;">
            <div style="float: left; margin-top: 5px;">Chart</div>
        </div>

        <div class="panel-body">
            <!--Chart-->
            <div class="col-sm-6">
                <canvas id="myChart" width="325" height="325"></canvas>
            </div>

            <!--Panel to Stretch-->
            <div class="col-sm-6">
                <div class="panel panel-primary" style="border-color: #464646;">
                    <div class="panel-heading" style="border-color: #BBBBBB; height: 35px; padding-top: 3px;">
                        <div style="float: left; margin-top: 5px;"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

将嵌套面板拉伸到父面板的宽度

1 个答案: