twitter-bootstrap – 关于Bootstrap 3响应面板设置宽度的问题
发布时间:2020-12-17 20:40:03 所属栏目:安全 来源:网络整理
导读:你能否看一下 This Demo,让我知道为什么面板的标题表现得像演示(从左和右获得边距)? 正如我在帖子标题中提到的,我正在尝试创建一个响应式面板,因此右侧的所有元素 – 面板 – 默认 – 喜欢Forms也表现出响应 div class="row"div class="col-lg-2 col-md-2 c
你能否看一下
This Demo,让我知道为什么面板的标题表现得像演示(从左和右获得边距)?
正如我在帖子标题中提到的,我正在尝试创建一个响应式面板,因此右侧的所有元素 – >面板 – 默认 – >喜欢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 --> (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |