Centrere links med CSS

Tags:    html css

Jeg har nogle links:


<ul>
<a href="test1.html">home1.</a>
<a href="test2.html">home2.</a>
<a href="test3.html">home3.</a>
<a href="test4.html">home4.</a>
</ul>

Hvordan kan jeg centrere disse?



6 svar postet i denne tråd vises herunder
1 indlæg har modtaget i alt 1 karma
Sorter efter stemmer Sorter efter dato
udover et du nok gerne vil have nogle <li>'s også, så kan du bare give:

Fold kodeboks ind/udKode 


I css'en.



Kanon, tak skal du have.

Jeg tillader mig at stille endnu et spørgsmål; nu har jeg centreret disse links horizontalt, men hvorledes ændre jeg på den vertikale position?



vertical-align: middle;

Der er nogle tilfælde hvor det ikke virker. Kan ikke helt huske det.



vertical align er noget man kan sætte på en celle, og ikke et block element som unorderet list. Desværre kan man alligevel ikke bare skrive:

ul li a
{
display:table-cell;
vertical-align: middle;
}

Du skal gøre som Per skriver, wrappe alle dine links ind i et list item tag.

<li><a href="#">...</a></li>

Hvis du vil sætte dem vertikalt korrekt, og de kun er på en linie, kan du benytte

ul li a
{
line-height: 30px; /* antal px skal være højden på elementet */
}

Skal indholdet være på flere linier kan du benytte

ul li
{
padding: 5px 0px; /* hvor det første cifre fortæller padding top/bottom*/
}

Ønsker du den samme effekt som en tabels celle, skal du ud i noget :

http://www.google.dk/search?hl=da&q=dead+centre&meta=






De skal ikke centreres vertikalt; kun horisontalt.

Vertikalt skal de placeres x pixels fra toppen.



Indlæg senest redigeret d. 11.06.2007 14:15 af Bruger #5542
tjaa, jeg ved sku heller ikke lige hvor jeg fik det fra.. :)

Så er det padding du skal have fat i.

Jeg formoder du har wrappet dem ind i <li> tags.

så skal du bare give dem noget padding-top: 10px;

/JJ




t