【问题标题】:How to make Bootstrap 3 full with for text on large screen without margin at the right?如何使Bootstrap 3在大屏幕上充满文本而右侧没有边距?
【发布时间】:2016-11-21 13:42:03
【问题描述】:

我一直在尝试为大屏幕上的文本设置全角引导程序,但即使我使用了在 stackoverflow 上找到的 container-fluid 和 another solution,这应该使我能够创建一个全宽的 div,但 div 内的文本是仍然不是全宽。如demo中所见,大屏屏幕右侧仍有空格

这是我的代码

<div class="container-fluid ">

    <div class="row ">
      <div class="col-lg-12 ">

      <div class="full-width-div testons">
      dfkjsdfjklsdf fsf asfsdfjdfasdf sdfsdfasd dfsdfas fasf sdfsdfas fasdfsd dfsdfas dfdsfa dfasfa faskdkfdk ajfdkjfjasd jafksdfjj afdfjksdf afdfsdf dfajkfjadkf afdfsf adfsdfs afdfdasf afsdf adfsfdf adfsdfsd afdsfsdf afdsfsd dfkjsdfjklsdf fsf asfsdfjdfasdf sdfsdfasd dfsdfas fasf sdfsdfas fasdfsd dfsdfas dfdsfa dfasfa faskdkfdk ajfdkjfjasd jafksdfjj afdfjksdf afdfsdf dfajkfjadkf afdfsf adfsdfs afdfdasf afsdf adfsfdf adfsdfsd afdsfsdf afdsfsd dfkjsdfjklsdf fsf asfsdfjdfasdf sdfsdfasd dfsdfas fasf sdfsdfas fasdfsd dfsdfas dfdsfa dfasfa faskdkfdk ajfdkjfjasd jafksdfjj afdfjksdf afdfsdf dfajkfjadkf afdfsf adfsdfs afdfdasf afsdf adfsfdf adfsdfsd afdsfsdf afdsfsd dfkjsdfjklsdf fsf asfsdfjdfasdf sdfsdfasd dfsdfas fasf sdfsdfas fasdfsd dfsdfas dfdsfa dfasfa faskdkfdk ajfdkjfjasd jafksdfjj afdfjksdf afdfsdf dfajkfjadkf afdfsf adfsdfs afdfdasf afsdf adfsfdf adfsdfsd afdsfsdf afdsfsd dfkjsdfjklsdf fsf asfsdfjdfasdf sdfsdfasd dfsdfas fasf sdfsdfas fasdfsd dfsdfas dfdsfa dfasfa faskdkfdk ajfdkjfjasd jafksdfjj afdfjksdf afdfsdf dfajkfjadkf afdfsf adfsdfs afdfdasf afsdf adfsfdf adfsdfsd afdsfsdf afdsfsd dfkjsdfjklsdf fsf asfsdfjdfasdf sdfsdfasd dfsdfas fasf sdfsdfas fasdfsd dfsdfas dfdsfa dfasfa faskdkfdk ajfdkjfjasd jafksdfjj afdfjksdf afdfsdf dfajkfjadkf afdfsf adfsdfs afdfdasf afsdf adfsfdf adfsdfsd afdsfsdf afdsfsd 
      </div>


      </div>
    </div>
</div>

除了引导之外的 CSS

html {
  font-family: 'Open Sans', sans-serif;
  font-size:16px;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;

}


body {
  margin:0px;
  margin-top:0px;
  padding:0; margin:0;

}

.testons {
    background:#14b5d1;
}

.full-width-div {
    position: absolute;
    width: 100%;
    left: 0;
    right:0;
    margin-right: 0;
}

如何让Bootstrap 3在大屏上用文字填满,右边没有边距?

【问题讨论】:

  • 你能展示一下它的样子吗?我没有看到您引用的演示
  • 你试过margin-right: 0吗?
  • 是的,我刚刚做了,但没有任何改变。我添加到full-width-div
  • .row 或 .col-*-* 是罪魁祸首;我忘了是哪一个,但默认情况下,使用这些元素时,左右两侧都有一个 15px 的边距,称为“gutter”。
  • 好的,谢谢,但如何摆脱它。显然它在右边。即使当我删除 row 和 col 时,我仍然在 container full 下遇到同样的问题

标签: css twitter-bootstrap


【解决方案1】:

.row 和 .col-lg-12 - 在这里毫无意义。删除它

【讨论】:

  • 即使我这样做,它仍然给出相同的结果,除非你可以请提供我一个工作 jsfiddle
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2014-05-09
  • 2023-02-25
  • 1970-01-01
  • 2022-11-18
  • 2016-05-11
  • 1970-01-01
  • 2018-02-19
相关资源
最近更新 更多