CSS-tekst-uitlijnen: Centrum; Centreert geen dingen

Ik heb de volgende HTML:

<div id="footer">
    <ul id="menu-utility-navigation" class="links clearfix">
        <li class="menu-685 menu-site_map first">Site Map
        </li>
        <li class="menu-686 menu-privacy_policy">Privacy Policy
        </li>
        <li class="menu-687 menu-terms___conditions">Terms &amp; Conditions
        </li>
        <li class="menu-688 menu-contact_us last">Contact Us
        </li>
    </ul>
</div>

Met de volgende CSS:

div#footer {
    font-size: 10px;
    margin: 0 auto;
    text-align: center;
    width: 700px;
}

Ik gooide in het lettertype-formaat net om te zien of de stijl werkte (Firebug rapporten het werkt, maar ik wilde zien). Het werkt. Maar de tekst is niet gecentreerd in de voettekst in Firefox of in Safari (moet het nog inchecken in IE).

Ik heb geprobeerd met en zonder marge: 0 Auto; en met en zonder tekst-uitlijnen: centrum; Geen combo van die dingen werkte.

Hier wordt uitgevoerd van Firebug:

div#footer {
    font-size: 10px;
    margin: 0 auto;
    text-align: center;
    width: 700px;
}
Inherited fromdiv#page
#skip-to-nav, #page {
    line-height: 1.5em;
}
Inherited frombody.html
body {
    color: #666666;
    font-family: verdana,arial,sans-serif;
}

Help?


Antwoord 1, Autoriteit 100%

Ik neem aan dat je alle items naast elkaar wilt, en het hele ding om horizontaal te worden gecentreerd.

lielementen zijn standaard display: blocken nemen alle horizontale ruimte in beslag.

Toevoegen

div#footer ul li { display: inline }

Als je dat eenmaal hebt gedaan, wil je waarschijnlijk de opsommingstekens van de lijst verwijderen:

div#footer ul { list-style-type: none; padding: 0px; margin: 0px }

Antwoord 2, autoriteit 30%

Als u een inline-block-element het midden horizontaal wilt laten uitlijnen in het bovenliggende element, voegt u text-align: centertoe aan het bovenliggende element.


Antwoord 3, autoriteit 11%

Als je wilt dat de tekst in de lijstitems gecentreerd wordt, probeer dan:

ul#menu-utility-navigation {
  width: 100%;
}
ul#menu-utility-navigation li {
  text-align: center;
}

Antwoord 4, autoriteit 2%

Je kunt flex-grow: 1gebruiken. De standaardwaarde is 0en hierdoor ziet de text-align: centereruit als left.

https://css-tricks.com/almanac/properties/ f/flex-grow/


Antwoord 5

Dit werkte voor mij:

 e.Row.Cells["cell no "].HorizontalAlign = HorizontalAlign.Center;

Maar 'css text-align = center 'werkte niet voor mij

ik hoop dat het je zal helpen


Antwoord 6

Gebruik display: block;margin: auto;
het centreert de div


Antwoord 7

Ik weet niet dat je een Bootstrap-versie gebruikt, maar de nuttige hulpklasse voor het centreren en blokkeren van een element in het midden is .center-blockomdat deze klasse marginen displayCSS-eigenschappen, maar de klasse .text-centerbevat alleen de eigenschap text-align

Bootstrap Helper Class middenblok

Other episodes