三个面板的引导网格布局
三个面板的引导网格布局
提问于 2014-11-13 05:56:48
我有三个面板，在台式机上应该是这样
______________ ___
| | | |
| | | |
| 1 | | 3 |
|______________| | |
______________ | |
| | | |
| | | |
| 2 | | |
| | | |
|______________| |___|但是在小型设备上，面板应该是合适的
____
| 1 |
|____|
____
| 3 |
|____|
____
| 2 |
|____|我试过了
<div class="col-md-9></div>
<div class="col-md-3></div>
<div class="col-md-9></div>然后panel2倒下了，然后尝试
<div class="col-md-9>
<div></div>
<div></div>
<div>
<div class="col-md-9></div>在小型设备上订购错误。
谢谢
回答 2
Stack Overflow用户
回答已采纳
发布于 2014-11-14 03:12:23
解决方案是为大型设备添加浮动:正确的样式。
@media (min-width: 768px) {
.sm-pull-right{
float:right;
}
}
<body>
<div class="container-fluid">
<br />
<div class="row">
<div class="col-sm-9" style="background-color: green;">111111</div>
<div class="col-sm-3 sm-pull-right" style="background-color: yellow;height:220px;">333333</div>
<div class="col-sm-9" style="background-color: brown;">2222222</div>
</div>
</div>Stack Overflow用户
发布于 2014-11-13 06:09:36
尝试以下几个方面：
<body>
<div class="container-fluid">
<br>
<div class="row">
<div class="col-md-9 col-xs-9" style="background-color: green;">111111</div>
<div class="col-md-3 col-xs-9" style="background-color: yellow;">333333</div>
<div class="col-md-9 col-xs-9" style="background-color: brown;">2222222</div>
</div>
</div>
</body>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/26902277
复制相关文章
相似问题
腾讯云开发者
