Html 什么样的css代码可以让我将div放置在彼此相邻的位置而不是顶部？

我一直在使用网格系统，以便在页面的页脚处有一列。我想将带有陶器文字的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>

---

看起来最简单的方法是浮动它们，即

float:left

。我试过@pangloss它不起作用。你应该删除container div上的内联填充，而且

是无效的html，它应该是

或者只是

。这很有效，非常感谢你必须做数学运算才能使网格像素完美。

.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;
}