Bootstrap布局问题 - 从容器中浮出的行div

Question

我正在构建一个我正在构建的网站上的引导程序布局的两个问题，我想知道是否有人可以指出我哪里出错了。我已将我的网站置于子域名上，以便您可以看到我面临的问题。它可以在http://cefn.mywebsitebuild.co.uk//fixtures-results/first-team/

找到

问题一 col-xs-12 fix-result div浮动在容器外面，我不确定原因。我还想让它与图像对齐，看看我的图像上的绿线

问题二 col-xs-12匹配赞助商div也在容器外浮动，我不确定为什么

我上传了我的网页来源http://www.bootlint.com/，它告诉我您的代码存在问题。

有人可以告诉我我能做些什么才能让它发挥作用？

由于 保罗

Answer 1

您可能不想为该图像调整div。我强烈建议保留当前的引导程序设置。相反，如果你想用该图像填充div，请将此属性添加到该图像的父div。这样，图像将与其余的div对齐。

style="
    padding: 0px 0px;
"

Answer 2

您以不同方式嵌套行。这是最简单的修复：

<!-- This is your very first row -->
<div class="row">
    <div class="col-md-12">
        <div class="row"> <!-- INSERT ROW HERE -->
            <h4 class="heading-mini">First Team Fixtures &amp; Results</h4>
            <img src="/media/1014/img_5507.jpg?crop=0,0.24305557250976545,0.0000000000000007579122514774,0.33194442749023489&amp;cropmode=percentage&amp;rnd=131162832050000000" class="img-responsive team-photo" alt="" title="">
                <p class="photo-names">Back row (left to right): Paul Griffiths, Nathan Williams, Sam Roberts, Oliver Davies, Jamie Rawlinson</p>
        </div> <!-- END ROW HERE -->
    </div>
</div>

但是，我不会说这是最好的修复...抱歉。 （我会选择在其他地方删除嵌套的行/列...）

问题2是一回事。 （你在其他地方嵌套了行 - >＆gt; col-＆gt; row-＆gt; col。）

Answer 3

您通过将以下内容添加到父行divs

来解决此问题

<div class="row" style="margin-left:0px; margin-right:0px;">

嵌套引导程序验证并且它现在看起来像我想要的那样（希望它是正确的）

我计划创建一个类应用边距修复并将类应用于父行div而不是使用内联样式。

谢谢