Как разместить текст в веб-форме?

Question

Это то, что у меня есть, и оно не центрируется. По какой-то причине.

<div> 
     <asp:Label ID="eagleReplicationManagerLabel" runat="server" CssClass="eagleReplicationManagerLabel"> 
       Eagle Replication Manager 
     </asp:Label> 
    </div> 

CSS для него:

.eagleReplicationManagerLabel 
{ 
    position: fixed; 
    font-size: 30px; 
    color: #0000FF; 
    text-align: center; 
} 

Answer 1

Это на самом деле работает, но вы не могли видеть результат, поскольку он отображается как диапазон, который принимает точную ширину его содержимого. Поэтому в тексте не было достаточно места для настройки.

Увеличение ширины в вашем стиле CSS покажет вам, почему

.eagleReplicationManagerLabel 
{ 
    position: fixed; 
    font-size: 30px; 
    color: #0000FF; 
    text-align: center; 
    width:500px; 
} 

Answer 2

В text-align: center; потребности быть на <div>, который содержит метку.

Answer 3

текст центрирован, но является встроенным элементом, поэтому он является настолько широким, как текст внутри.

Вот почему вы не можете сказать, что он центрирован.

Дайте ему немного ширины или заставьте его заблокировать, и вы увидите центрирование.

.eagleReplicationManagerLabel 
{ 
    position: fixed; 
    font-size: 30px; 
    color: #0000FF; 
    text-align: center; 
    display:block 
} 

Answer 4

Проблема здесь заключается в том, что asp:Label визуализируется как span на HTML и span элементы, по умолчанию, стилизовано display:inline; в результате ваш класс CSS ничего не делает.

Если вы хотите, чтобы отцентрировать текст в DIV установите text-align:center на DIV или установить display:block на .eagleReplicationManagerLabel

.eagleReplicationManagerLabel 
{ 
    position: fixed; 
    font-size: 30px; 
    color: #0000FF; 
    text-align: center; 
    display:block; 
} 

Answer 5

.center{ 
width:200px; 
margin:auto; 
} 

.eagleReplicationManagerLabel 
{ 
position: fixed; 
font-size: 30px; 
color: #0000FF; 
text-align: center; 
} 
<div> 
<div class="center"> 
    <asp:Label Text="Eagle Replication Manager" ID="eagleReplicationManagerLabel1" runat="server" CssClass="eagleReplicationManagerLabel"></asp:Label> 
</div> 

</div>