[英]How do I align the text correctly in html
我正在嘗試像第一行一樣將文本向右對齊,但是第二行一直溢出到圖像下方。 無論行數如何,如何使文本正確對齊?
<a href="javascript:;" id="A_3"><i id="I_4"></i></a><span id="SPAN_5">
</span>
<h5 id="H5_6">Payroll</h5>
<p id="P_7">
What what everytrksdjfsdf sdmnb fsdmnb sd xcmnvb xcm mbb mvcn bcvxmcnbv</p>
請檢查jsbin :
編輯:我看到Safari(1)正確顯示了此內容,但Google Chrome(2)沒有顯示。
刪除box-sizing: border-box;
從這兩個要素。 還要添加width: 457.5px;
到#H5_6
檢查以下代碼。
#A_3 { float: right; height: 65px; text-align: center; width: 65px; background: rgb(153, 153, 153) none repeat scroll 0% 0% / auto padding-box border-box; border-radius: 50% 50% 50% 50%; font: normal normal normal normal 35px / 50px'Open Sans', arial, sans-serif; } /*#A_3*/ #H5_6 { text-align: right; width: 457.5px; } /*#H5_6*/ #P_7 { color: rgb(95, 95, 95); height: 56px; text-align: right; width: 457.5px; font: normal normal 300 normal 16px / 30.8px'Open Sans', arial, sans-serif; } /*#P_7*/
<a href="javascript:;" id="A_3"><i id="I_4"></i></a><span id="SPAN_5"></span> <h5 id="H5_6"> Payroll </h5> <p id="P_7"> What what everytrksdjfsdf sdmnb fsdmnb sd xcmnvb xcm mbb mvcn bcvxmcnbv What what everytrksdjfsdf sdmnb fsdmnb sd xcmnvb xcm mbb mvcn bcvxmcnbv </p>
http://jsbin.com/qigitoyeyo/1/edit?html,css,output
您可以只設置“ margin-right:115px;” 在<p>標記上。
這樣,您不必手動設置高度和寬度。
我通過添加來修復它
margin: 0px 25px 80px;
到A_3元素(引導程序圈)
非常感謝你的幫助!
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.