Boxes side by side?

Question

I can't figure out how to put the two div boxes side by side.

The second box appears lower and in the middle. It should be in the middle, next to the first box. Can anyone figure out what I've done wrong?

<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

You should put a style of float: left; on both of the divs. You could also put a height and width on them if you needed them to be the same size.

If you float them both you also might need to put a third div under them to clear the float

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

Answer 3

You must add float:left on del divs

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

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