試圖對齊文本與浮動一個div右對齊文本右
試圖在卡添加到我的信息,似乎與電話號碼的工作,但如果我是浮動的權利它不行。
此外,當我的屏幕較小,然後400px信息文本似乎不是100%居中。
代碼:
p span {
display: inline-block;
width: 100px;
}
.responsive {
display: inline-block;
width: 100%;
}
.responsive .left {
float: left;
width: 50%;
}
.responsive .right {
float: right;
text-align: right;
width: 50%;
}
@media (max-width: 400px) {
.responsive .left,
.responsive .right {
width: 100%;
text-align: center;
}
}
<div class="responsive">
<div class="left">
<h2>Infomation:</h2>
<p>
<span>Phone: </span>(00) 00000000<br/>
<span>Fax: </span>(00) 00000000<br/>
<span>Email: </span><a href="mailto:[email protected] ">[email protected]<br/></a>
</p>
</div>
<div class="right">
<h2>Business Hours:</h2>
<p>
<span>Mon - Th:</span> 8:30 - 5:00<br/> <span>Friday:</span> 8:30 - 3:30<br/>
</p>
</div>
</div>
你怎麼想它aligne d ..? – blackandorangecat
@blackandorangecat那麼屏幕isbigger然後400px我希望日期有數字相同的選項卡。而當它小於400時,我希望它全部以中心爲中心,此刻它的偏離中心。 – nathan
首先,由於您已在「p span」元素上定義了「100px」的寬度,因此事物並未出現在較小的設備上。改用'padding'或'margin'。 關於另一個問題,您需要提供更多信息。 –