2016-08-17 71 views
0

我需要其他方法在一行中創建2個元素(1個左對齊和1個右對齊)。我用display: flex;和iOS 9 Safari瀏覽器上正常顯示,但它不會正確地在Safari上的iOS 6顯示css - 需要替代方法來將2個元素在一行中對齊

它應該像這樣(的iOS 9) http://i.stack.imgur.com/SO3RM.jpg

這裏是iOS 6的 http://i.stack.imgur.com/jHK5l.jpg

我的CSS代碼

.signedlatest { 
    font-family: "sfns_displayregular"; 
    font-size: 13pt; 
    font-color: #ffffff; 
    background: #ffffff; 
    display: flex; 
    justify-content: space-between; 
    margin: 0; 
    border-top-style: solid; 
    border-bottom-style: solid; 
    border-color: gray; 
    border-width: 0.5px; 
    line-height: 250%; 
    padding-left: 0.3cm; 
    padding-right: 0.3cm; 

}

HTML

<div class="signedlatest> 
<a>iPhone 6S Plus</a> 
<a>iOS 9.3.4</a> 
......... 
<a>iPhone 4S</a> 
<a>iOS 9.3.4</a> 
</div> 
+0

你試過浮他們左右(後來清) ? – lynxlynxlynx

回答

0

嘗試使用<table>

table tr td:first-child{ 
 
    padding-right:20px; 
 
} 
 
table tr{ 
 
    border-bottom:1px solid black; 
 
}
<table> 
 
    <tr> 
 
    <td>iPhone 6S Plus</td> 
 
    <td>iOS 9.3.4</td> 
 
    </tr> 
 
    <tr> 
 
    <td>iPhone 6S</td> 
 
    <td>iOS 9.3.4</td> 
 
    </tr> 
 
    <tr> 
 
    <td>iPhone 5</td> 
 
    <td>iOS 9.3.4</td> 
 
    </tr> 
 
</table>

0

你可以這樣做:

a { 
    float: left; 
    width: 50%; 
    border-bottom: 1px solid #ddd; 
} 

a:nth-child(2n) { 
    text-align: right; 
}