html - 没有任何填充或空格的两列 Bootstrap 布局

Question

这类似于我要实现的布局:

我现在的代码

 <div class="row ">
        <div class="col-lg-6 row-eq-height push-right">
            <img src="1.jpg" class="img-responsive">
        </div>

        <div class="col-lg-6 row-eq-height">
            <div class="eq-row-text ">
                 <p class="row-text">Text description for image </p>
            </div>
        </div>
    </div>

    <div class="row ">
         <div class="col-lg-6 row-eq-height ">
            <div class="eq-row-text ">
                 <p class="row-text"> Text description for the image </p>
            </div>
        </div>

        <div class="col-lg-6 row-eq-height">
            <img src="1.jpg" class="img-responsive">
        </div>
    </div>

我尝试过使用 CSS 类“no-padding”，也尝试过调整边距。当我应用 0 填充时，第一个图像的左侧接触浏览器的边缘(这是需要的)，但是另一个边缘(图像的右侧)仍然有一些空白。

我如何摆脱空白区域以获得类似引用布局的结果？

Answer 1

.col-md-6{
    padding-right: 0px;
    padding-left: 0px;
}