gpt4 book ai didi

twitter-bootstrap - 为 Bootstrap 3 响应式面板设置宽度的问题

转载 作者:行者123 更新时间:2023-12-04 07:48:09 26 4
gpt4 key购买 nike

请看一下This Demo让我知道为什么面板的标题表现得像演示(从左和右获得边距)?正如我在帖子标题中提到的那样,我正在尝试创建一个响应式面板,因此 righttoc-->panel panel-default--> 侧的所有元素(如 Forms)也表现出响应式

<div class="row">
<div class="col-lg-2 col-md-2 col-sm-2 col-sx-12" id="lefttoc">Left</div>
<div class="col-lg-7 col-md-7 col-sm-7 col-sx-12" id="maptoc">Center</div>
<div class="col-lg-3 col-md-3 col-sm-3 col-sx-12" id="righttoc">
<div class="panel panel-default col-lg-10 col-md-11 col-sm-2 col-sx-12 ">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
<div class="panel-body">
Panel content
</div>
</div>
</div>
</div><!-- End of Row -->

谢谢

最佳答案

问题主要在于您嵌套了列而没有在其间添加所需的行元素。解决您的问题的行有负边距。

试试这个:

<div class="row">
<div class="col-sm-2 col-xs-12" id="lefttoc">Left</div>
<div class="col-sm-7 col-xs-12" id="maptoc">Center</div>
<div class="col-sm-3 col-xs-12" id="righttoc">
<div class="row">
<div class="col-lg-10 col-md-11 col-sm-2 col-xs-12">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>

<div class="panel-body">Panel content</div>
</div>
</div>
</div><!-- End of Row -->
</div>
</div><!-- End of Row -->

关于twitter-bootstrap - 为 Bootstrap 3 响应式面板设置宽度的问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24287969/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com