Question

我想使下面的div跨越页面的整个宽度，但是当前它仅跨越页面的中间部分（内容的其余部分也是如此）。

我试图在我的CSS中包括width：100％，我也试图删除该容器，但是如果这样做的话，我无法将两个列并排放置。

<div class="container full-width">
  <div class="row-fluid">
    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-6 col-xl-6">

      <h2>What we do.</h2>
      <h4>Put some text in here about what we do just to see what it looks like. </h4>
      <a href="#"><button>Services</button></a>

    </div>

    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-6 col-xl-6">

      <a href="<?php bloginfo('url');?>"> <img src="<?php bloginfo('template_directory');?>/images/logo.png" class="img-fluid logo"> </a>

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

Answer 1

将最外面的.container更改为.container-fluid.，将任何固定宽度的网格布局转换为全角布局

https://codepen.io/arhoy/pen/NWKMgep?editors=1010

如何使两列div跨越页面的整个宽度

1 个答案: