如何在移動版網站中對齊div標籤？

Question

我在做一個使用JSBin的網站。

這是在http://jsbin.com/alajih/10

的問題是移動的大小，我做的事情。第一個圖像堆疊很好。第二個圖像在右側突出並且與頂部圖像不匹配時會出現奇怪的現象。不知道爲什麼會這樣。

下面是一些代碼：

@media (max-width: 767px) { 
    .contacttext { 
     font-size: 19px; 
     font-weight: bold; 
     vertical-align:middle; 
    } 
    .nav { 
     margin: 0; 
    } 

    .contact > li { 
     display:block; 
     width:767px; 
     float:none; 
    } 

    .social{ 
     color: #fff; 
     display:block; 
     float:none; 
    } 
    li { 
     padding: 7px 20px 0 0px; 
    } 
    row-fluid > .span8 { 
     width:100%; 
     display: block; 
     float: none; 
    } 
    .span4 { 
     width:100%; 
     display: block; 
     float: none; 
    } 

    .row-fluid [class*="span"] { 
     float: none; 
     width: 100%; 
    } 
    .row-fluid > .firstpic { 
     padding: 0 0 20px 0; 
    } 

} 

Answer 1

修改CSS添加：

.row-fluid [class*="span"] { 
    margin-left: 0px; 
}