html - 容器宽度问题

标签 html css twitter-bootstrap twitter-bootstrap-3

我有一个固定的标题和 260 像素的右侧。我有三列高度为 100%内容区域是一个 12 列宽的流体容器

<div class="header"></div>
<div class="secondary-aside"></div>
<div class="container">
    <div class="row">
      <div class="col-sm-4"></div>
      <div class="col-sm-4"></div>
      <div class="col-sm-4"></div>
    </div>
</div>

下面是我正在研究的 fiddle 。 cols 的宽度与布局不符。

http://codepen.io/anon/pen/qxusJ

最佳答案

不是很清楚你所说的 The width of the cols are breaking with the layout.

这样试试:

html, body, .container {
    height:100%;
    width:100%; /*keep html and body 100% */
    margin:0;
    background:lightgray
}
.container {
    display:table;
    width:calc(100% - 260px);/*keep container 100% - 260px */
    border-spacing:0.5em;
}

关于html - 容器宽度问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24776876/

相关文章:

javascript - 如何在加载应用程序之前添加搜索功能

jquery - Bootstrap 模式和多个 vimeo 视频

javascript - Bootstrap Accordion 切换逻辑

javascript - 在 keydown 上,为什么值的 console.log 与将值分配给对象不同?

javascript - 如何通过单击提交按钮将各个动态创建的元素的 id 传递给函数 - javascript

php - 我的 html 表单值没有发送到 MYSQL 数据库

css - 谷歌字体在 chrome 中被视为不安全的脚本

css - 我应该使用带有字体的 webpack 吗?

css - 导航栏容器是流动的但它仍然没有全宽?

html - 如何在具有不同背景的已选中和未选中状态下设置 radio 输入的样式?