2012-07-03 22 views
12

Mam poważne problemy z uruchomieniem najprostszych kodów. Chcę, aby moja horyzontalna lista css była wyśrodkowana, to wszystko.CSS: Jak wyśrodkować listę poziomą? Wyświetlanie: nie działa Inline

link tutaj: http://bit.ly/LtIBai

mam ten kod:

#megaMenu.megaMenuHorizontal ul.megaMenu { 
text-align: center; 
} 

#megaMenu.megaMenuHorizontal ul.megaMenu > li { 
display: inline; 
} 

Jednak nie będzie Center?

UWAGA: Okno musi mieć rozmiar "portretu tabletu", aby zobaczyć kod, do którego się odwołuję. Około 800 pikseli szerokości, gdy logo jest wyśrodkowane, a menu przechodzi do następnego wiersza, ale zanim pojawi się menu mobilne.

+0

Stary, powinieneś naprawdę pomyśleć o swoich selektorach, które nie wyglądają zbyt dobrze. Na przykład, dlaczego miałbyś wywoływać '# megaMenu.megaMenuHorizontal', gdy masz identyfikator? Nie używaj też 'ul.megaMenu', ponieważ przeglądarka najpierw wyszuka wszystkie' ul', a następnie wybierze '.megaMenu'. Czy na pewno nie możesz po prostu użyć czegoś takiego jak '#megaMenu ul' i' #megaMenu li'? Twoje zdrowie. – Cthulhu

Odpowiedz

27

Powodem, dla którego odmawiają centrowania, jest fakt, że są one również wypuszczane w lewo. Zmień dislay: inline na display: inline-block; float: none i wydają się wyśrodkowane.

Edit: Jest dużo z (przeważnie niepotrzebnych) kod CSS tam więc prawdopodobnie będziesz musiał podkręcić kilka innych rzeczy, zanim to wygląda w porządku, ale pływających, co jest przyczyną nie-centrowania przynajmniej.

+0

Dziękuję! Działa idealnie. Tak, mega menu plugin daje wszelkiego rodzaju nonsens css. Ale na razie to zrobi! –

+0

Cieszę się, że mogę Ci pomóc. – powerbuoy