javascript - Bootstrap 3 : Extending div outside container on right side

标签 javascript jquery html css twitter-bootstrap

我正在尝试制作一个布局,该布局需要一个 div 将其扩展到右侧的 .container div 之外。

这是 fiddle :http://jsfiddle.net/krish7878/c5n365ek/1/

HTML代码:

<div class="container">
    <div class="row">
       <div class="col-lg-6 col-md-6 col-sm-6 left">
           Left Container
        </div><!-- /.col-6 -->
        <div class="col-lg-6 col-md-6 col-sm-6 right">
            Right Container
        </div><!-- /.col-6 -->
    </div><!-- /.row -->
</div><!-- /.container -->

CSS 代码:

.left{
    background-color: #999;
    height: 50px;
    padding: 30px 0px;
}
.right{
    background-color: #49c8ff;
    height: 50px;
    padding: 30px 0px;
}

我希望蓝色背景的右侧容器在右侧完全延伸。

最佳答案

这是您要找的吗?你只需要制作 .container width:100% 然后你可以添加 padding-left

.container{
  width: 100%;
  padding-left: 120px; //whatever you want
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

FIDDLE

关于javascript - Bootstrap 3 : Extending div outside container on right side,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27734158/

相关文章:

c# - 如何使用 javascript 运行 C# 命令?

javascript - 页面中有 2 个表的表排序器问题

html - 使 Bootstrap 导航栏分隔线均匀分布

javascript - 将用户输入推送到本地存储阵列

javascript - 如何检查 ul 中每个 li 文本的颜色?

javascript - onkeydown 与 jquery 和 javascript 功能

php - 从 wordpress 编辑页面屏幕中删除主编辑器

javascript - 使用打开/关闭文本显示隐藏多个内容

javascript - 解析嵌套 json 的语法

javascript - 如何在服务器处理时禁用所有内容、div 等