什么css代码允许我将我的div放在彼此旁边而不是顶部？

Question

我一直在使用网格系统允许我在页面的页脚上有一列。我想在联系信息旁边而不是在其下方移动带有陶器文本的Div。

我用于页脚的Html是：

<div style=" text-align:left; color:#FFF" class="sitemaps">
<div class="section group">
<div style=" text-align:left; padding:4% 0% 6% 10%; color:#FFF" class="span_8_of_8">
    <div class="span_2_of_8">
    <p>My House</br>My road</b>My Town</br>My City</br>Zip Code</br></br>012345678910</br></br>Email@mydomian.co.uk</p>
    </div>
    <div class="span_1_of_8">
    <p><strong style="color:#555">About Us</strong></br>Home</br>Terms Of Hire</br>Contact Us</p>
    </div>
    <div class="span_1_of_8">
    <p><strong style="color:#555">Crockery</strong></br>Classic</br>Contemporary</br>Squared</p>
    </div>
</div>
</div>
</div>

我使用的Css代码是：

.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }
/*  GRID OF EIGHT  */
.span_8_of_8 {
    width: 100%;
}

.span_7_of_8 {
width: 87.3%;
} 

.span_6_of_8 {
width: 74.6%;
}

.span_5_of_8 {
width: 61.9%;
}

.span_4_of_8 {
width: 49.2%;
}

.span_3_of_8 {
width: 36.5%;
}

.span_2_of_8 {
width: 23.8%;
}

.span_1_of_8 {
width: 11.1%;
}

/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 480px) {
.col {  margin: 1% 0 1% 0%; }
.span_1_of_8, .span_2_of_8, .span_3_of_8, .span_4_of_8, .span_5_of_8,           .span_6_of_8, .span_7_of_8, .span_8_of_8 { width: 100%; }
}
.sitemap{
width:100%;
background-color:#69aodo;
}