在父母的中間放置一個最大寬度和對齊文本

在我的一行中，我想將最大寬度和居中我的文本在該div內。在父母的中間放置一個最大寬度和對齊文本

我的主頁文本目前的樣子：：

我想放一個最大寬度和中心這一節中的文本。

理想的結果：

CSS

.homepage-text { 
    font-size: 130%; 
} 

.light-section { 
     background-color: lightblue; 
    /* color: white; */ 
     text-align: center: 
    }

HTML

 <div class="row light-section"> 
     <div class="col-sm-12"> 
    <div class="col-sm-12 homepage-text"> 

<p>Text sit's here</p> 
</div></div></div>

活動鏈接：http://185.123.97.138/~kidsdrum/moneynest.co.uk/

來源

2016-03-28 Sam Jefferies

也許我不明白到底是什麼你的意思，但試試這個：

.homepage-text { 
    font-size: 130%; 
    max-width: 1000px; 
    margin: 0 auto; 
    float: none; 
}

來源

2016-03-28 18:02:49 lomboboo

感謝隊友，切換最大寬度到750px，這是完美的 –

不客氣！ – lomboboo

試試這個代碼：

.homepage-text { 
    font-size: 130%; 
    width: 960px; 
    margin: auto; 
    float: none; 
}

我給自己定一個固定的width的960px而不是流體width的100%和中心此容器與margin: auto; 另外，您必須取消設置float屬性才能使margin: auto;正常工作。

來源

2016-03-28 18:02:52

裹在一個固定width或淋漓盡致寬度max-width格的內容，然後使它float:none;，並設置你也可以使用動態餘量&寬度值把這事辦成，左右頁邊距auto !important

<div class="row light-section"> 
<div class="col-sm-12"> 
<div class="col-sm-12 homepage-text" style="width: 400px; float: none;margin: 0 auto !important;"> 

<p>Text sit's here</p> 
</div> 
</div> 
</div>

來源

2016-03-28 18:05:20

，而不改變浮標，也不使用margin: 0 auto;（如果要使用該邊距，則必須使用float: none;否則，它不會自動將主頁文本居中）。

.homepage-text { 
    font-size: 130%; 
    margin: 0 25% 0 25%; // Same as margin: 0 25%; but it illustrates 25+25+50=100% 
    width: 50%; 
}

來源

2016-03-28 18:11:43 Clomp

Bootstrap已經爲你完成了這項工作。所有你需要設置的是容器類的最大寬度。這樣做有助於保持頁面佈局的一致性。 Here is the fiddle.

.container { 
 
    max-width:700px; 
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/> 
 
<div class="row"> 
 
    <div class="container"> 
 
    <p>Text sit's here</p> 
 
    </div> 
 
</div>

來源

2016-03-28 18:25:00

在父母的中間放置一個最大寬度和對齊文本

回答

相關問題