盒子并排？

Question

我无法弄清楚如何将两个div盒并排放置。

第二个框出现在较低的中间位置。它应该位于第一个框旁边的中间。任何人都可以弄清楚我做错了什么？

<link href="http://static1.grsites.com/user/generate/items/9832134.css" rel="stylesheet" type="text/css" />
<div class="clearfix" id="resultcontainer" style="position: relative;">
    <center>
        <div style="width: 100%; text-align: left;">
            <div class="result9832134">
                <div class="content pie">
                    <div class="boxtitle">
                        <div class="boxtitleinner">
                            <p style="text-align: center;">
                                <span style="color: #ffffff; font-size: 24px;"><span style="font-weight: bold;"><span style="color: #000000;">NYHEDER</span></span></span></p>
                        </div>
                    </div>
                    <div class="boxtext">
                        <div>
                            <p>
                                <span style="color: #ffffff;">&nbsp;</span></p>
                            <p style="text-align: left;">
                                <span style="font-size: 24px; color: #ffffff;">N&aelig;ste kursusstart den 07/10 i Projektstyring i praksis &amp; PRINCE2&reg; Foundation cerificering.</span></p>
                            <p style="text-align: left;">
                                <span style="color: #ffffff;">&nbsp;</span></p>
                            <p style="text-align: left;">
                                <span style="font-size: 32px; color: #ffffff;"><a href="http://www.2b1group.dk/index2.php?option=com_content&amp;view=article&amp;id=126&amp;Itemid=91&amp;lang=da" style="color: #ffffff;" target="_blank"><span style="color: #ffffff;">Tilmelding her</span></a></span></p>
                            <p>
                                <span style="color: #ffffff;">&nbsp;</span></p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </center>
</div>


<link href="http://static1.grsites.com/user/generate/items/9832234.css" rel="stylesheet" type="text/css" />
<div :="" border="" left="" position="" top="">
    <div class="clearfix" id="resultcontainer" style="position: relative;">
        <center>
            <div style="width: 100%; text-align: left;">
                <div class="result9832234">
                    <div class="content pie">
                        <div class="boxtitle">
                            <div class="boxtitleinner">
                                <p style="text-align: center;">
                                    <span style="color: #ffffff; font-size: 24px;"><span style="font-weight: bold;"><span style="color: #000000;">PRAKTISK INFO</span></span></span></p>
                            </div>
                        </div>
                        <div class="boxtext">
                            <div>
                                <p>
                                    <span style="color: #ffffff;"><a href="http://www.2b1group.dk/kontakt.html" style="color: font-size: 24px; #ffffff;" target="_blank"><span style="font-size: 24px; color: #ffffff;">Find os her</span></a></span></p>
                                <p>
                                    &nbsp;</p>
                                <p>
                                    <span style="font-size: 24px; color: #ffffff;">Tlf: +45 1234 5678</span></p>
                                <p>
                                    &nbsp;</p>
                                <p>
                                    <span style="font-size: 24px; color: #ffffff;">Email: </span><span style="font-size: 24px;"><a href="mailto: bla@bla.dk" target="_blank">bla@bla.dk</a></span></p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
<!--[if lt IE 10]><script type="text/javascript" src="http://static1.grsites.com/user/generate/items/ie_compat.js"></script><![endif]-->        </center>
    </div>
</div>
<div class="clearfix" id="resultcontainer" style="padding: 50px 0;">
    <center>
        &nbsp;</center>
    <div class="clearfix" id="resultcontainer" style="padding: 50px 0;">
        <center>
            &nbsp;</center>
    </div>
</div>

Answer 1

http://jsfiddle.net/uBusa/

#resultcontainer{
    display:inline-block;
    float:left;
}​

Answer 2

您应该在两个div上添加float: left;样式。如果你需要它们的尺寸相同，你也可以在它们上面加上一个高度和宽度。

如果你漂浮他们两个你也可能需要在他们下面放置第三个div来清除浮动

<div style="clear: both"></div>

Answer 3

您必须在del divs

上添加float：left

<div style="width: 100%; text-align: left;float:left;">

<div :="" border="" left="" position="" top="" style="float:left;>