CSS對齊兩個文本部分中心（水平）

該圖像顯示了問題所在，我已經爲這部分寬度（移動版本）編寫了媒體查詢，但似乎無法在中心正確對齊我的兩個部分文本下面的圖像。CSS對齊兩個文本部分中心（水平）

2017-07-20 Tornike Shelia

分享代碼 – tech2017

https://codepad.co/snippet/MnxuSXBT#_=_ –

檢查答案可能對你有幫助。 – LKG

首先，您必須爲兩個文本部分或最小寬度設置兩列（50％寬度），然後才能水平居中。

.right { 
    text-align: center; 
    width: 50%; 
    float: right; 

} 
.left { 
    text-align: center; 
    width: 50%; 
    float: left; 
} 


<div class="right"> 
    <p>This text is centered.</p> 
</div> 
<div class="left"> 
    <p>This text is centered.</p> 
</div>

----在引導----

<style> 
    .text1{ 
    text-align: center; 
    } 
    </style> 

    <div class="row"> 
    <div class="col-xs-6" style="background-color:lavender;"> 
    <div class="text1"> 
    left side data. 
    </div> 
    </div> 
    <div class="col-xs-6" style="background-color:lavenderblush;"> 
    <div class="text1"> 
    left side data. 
    </div> 
    </div> 
    </div>

enter image description here

來源

2017-07-20 18:10:36

你可以更具體地瞭解如何做到這一點？ –

http://imgur.com/a/88Iv4 它沒有幫助 –

如果你使用引導，那麼它會很容易。我將在bootstrap中發佈答案 –

測試與類中的CSS：

.myClass{ text-align: center; }

或者與HTML中心標記。

來源

2017-07-20 18:06:44

是的，我已經設置了類屬性的左右部分文本對齊：中心，但它沒有幫助，我也不認爲HTML的中心標籤將在這裏很好，因爲我想調整這個文本中心只爲移動版本 –

在媒體查詢您設置了寬度，我認爲..所以，你做了什麼，使他們中心只需添加保證金自動..

.box{ 
    display:block; 
    width:250px; 
    float: none; 
    margin-left : auto; 
    margin-right:auto; 
    }

所以它會對準中心..

來源

2017-07-20 19:25:39 Manjunath

CSS對齊兩個文本部分中心（水平）

回答

相關問題