Question

我是这个论坛的新手，如果我提出一个微不足道的问题，请原谅。我尝试开发一个主题使用Bootstrap购买的网站。

我很快就学会了如何使用它，但是某些块存在对齐问题，我无法找到问题所在。

这是预期的（原理图）：

http://image.noelshack.com/fichiers/2015/38/1442431886-1.png

这就是我的实际情况：

http://image.noelshack.com/fichiers/2015/38/1442431875-sans-titre.png

这是我的html代码（有一些css添加）：

<div class="col-sm-6 col-md-6">
    <div class="thumbnail">
        <!-- First player -->

        <div class="caption">
            <h1 class="text-center">Nolife de la semaine</h1><img alt="..."
            src="http://image.noelshack.com/fichiers/2015/38/1442431132-default-skin.png" style=
            "display: block; margin-left: auto; margin-right: auto;">

            <h3 class="text-center">ilies91</h3>

            <h4 class="text-center">34 heures de jeu</h4>
        </div><!-- Second player -->

        <div class="caption text-center">
            <div class="pull-left"><img alt="..." src=
            "http://image.noelshack.com/fichiers/2015/38/1442431133-first4ever.png" style=
            "display: block;width: 85px; height: 85px; text-align:center"></div>

            <div class="pull-left" style="margin-left:10px;">
                <h5>Hannibal</h5>

                <h6>28 heures de jeu</h6>
            </div>
        </div><!-- Third player  -->

        <div class="caption text-center">
            <div class="pull-left"><img alt="..." src=
            "http://image.noelshack.com/fichiers/2015/38/1442431133-luciole.png"></div>

            <div class="pull-left" style="margin-left:10px;">
                <h5>Lucioledeeper</h5>

                <h6>16 heures de jeu</h6>
            </div>
        </div>

        <p class="text-center"><a class="btn btn-primary btn-sm" href=
        "http://forum.nimeria.fr/">Voir le classement général</a></p>
    </div>
</div>

这里有什么问题？对不起，很长的帖子。

谢谢你。

Answer 1

你可以使用带有引导程序“clearfix”类的DIV，然后使用右拉和左拉DIV来解决这个css浮动问题。

<div class="clearfix"></div>

解决方案：http://jsfiddle.net/fwbxbua8/

我如何强制我的div显示在块中？

1 个答案: