Forum PHP.pl > Wyśrodkowanie listy o zmiennej szerokości

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: Wyśrodkowanie listy o zmiennej szerokości

Forum PHP.pl > Forum > Po stronie przeglądarki > CSS

starach

14.02.2008, 19:07:20

Witam
Proszę o pomoc przy rozwiązaniu problemu dotyczącego wyśrodkowania
listy <ul> w której może być 6 elementów więcej lub też mniej.
Teoretycznie mógłbym oszacować średnią szerokość linku i wpisać wartości definiujące szerokość,
ale domyślam się że w jakiś prosty sposób można to zrobić dla listy która nie ma zdefiniowanej szerokości tyle tylko że nie wiem jaki.

[HTML] pobierz, plaintext 
<style>
.footer { float:left; width:100%; height:25px; background-color:#62798F; border:1px solid #212C37; }
.footer ul { float:left; margin:0 auto; padding:0; list-style:none; }
.footer ul li { float:left; }
.footer ul li a { height:20px; margin:0 10px 0 10px; font-size:9px; line-height:25px; }
.footer ul li a:hover { text-decoration:underline; }
</style>
 
<div class="footer">
	<ul>
		<li>Link1</li>
		<li>Link2</li>
		<li>Link3</li>
		<li>Link4</li>
		<li>Link5</li>
		<li>Link6</li>
	</ul>
</div>
[HTML] pobierz, plaintext

revyag

15.02.2008, 10:12:45

Proponuję dodać do .footer text-align:center, z ul i li wyrzucić float, dla li ustawić display:inline.

starach

15.02.2008, 11:34:40

Pomogło chociaż i tak IE sobie ze mnie jaja robi jak zwykle ale z tym już sobie poradzę dziękuję revyag

Kod

.footer { float:left; width:100%; height:25px; text-align:center; background-color:#62798F; border:1px solid #212C37; }
    .footer ul { margin:0 60px 0 60px; padding:0; list-style:none; }
    .footer ul li { display:inline; margin:0 15px 0 15px; }
    .footer ul li a {  margin:0; text-align:center; font-size:10px; line-height:25px; }
    .footer ul li a:hover { text-decoration:underline; }

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.