Centrowanie podmenu poziomą poniżej rodzica z css

najlepiej widać z Fiddle: http://jsfiddle.net/Jnttm/Centrowanie podmenu poziomą poniżej rodzica z css

Jak mogę uzyskać podmenu do centrum pod dominującą pozycję menu? Wiele znalezionych przeze mnie sztuczek centrujących nie ma zastosowania, ponieważ element potomny jest szerszy od elementu nadrzędnego.

Czy jest to możliwe w przypadku czystego CSS, czy muszę uciec się do javascript?
Jeśli wymagany jest JS, czy ktoś ma użyteczny kod JQuery?

Źródło

2011-10-27 Davy8

Może trzeba zdefiniować domyślne width do swojej submenu tak:

.sub-menu { 
    display: none; 
    position: absolute; 
    top: 20px; 
    left: 0; 
    white-space: nowrap; 
    text-align:center; 
    left:50%; 
    margin-left:-150px; 
    width:300px; 
} 
.active .sub-menu { 
    display:block; 
}

Sprawdź to http://jsfiddle.net/sandeep/Jnttm/1/

Źródło

2011-10-27 03:52:13 sandeep

osoba, która da mi downvote proszę wyjaśnić mi, gdzie się mylę. – sandeep

Nie jestem pewien, kto potrącił, ale to jest dokładnie to, o co prosiłem. Nie działałoby, gdyby było podłoże w tle, ponieważ jest szersze niż zawartość, ale w moim przypadku działa. (Teraz, gdy już go zaimplementowałem, nie wygląda to dobrze z liczbą podelementów, ale to nie było pytanie: p) – Davy8

będzie to centrum podmenu: ul > ul.sub-menu { position: absolute; left: 50%; transform: translateX(-50%) }

Źródło

2016-05-23 06:22:02 ashvek

Centrowanie podmenu poziomą poniżej rodzica z css

Odpowiedz

Powiązane problemy