PORADNIK Przyklejone menu

Często przydałoby się aby menu było cały czas na ekranie, jak to zrobić?
Wystarczy do własnego stylu dodać:

Code:

.menu {
    position: sticky;
    top: 0px;
    background-color: #fff;
    display: flex;
    align-items: center;
    min-height: 30px;
    padding: 0 11px;
  z-index:10000;
}

będzie to działać tak w wersji desktop jak i mobilnej.

 

Taka sytuacja

 

Taka sytuacja bo są błędy w CSS

 

W sensie że nie które poprzednie skrypty które wrzucałem do CSS mogą powodować błąd w działaniu tego?

 

Tak na przyklejone menu może wpłynąć wiele rzeczy i kod który podał TheL jest uniwersalny i prawidłowy jednak może wymagać dostosowania do obecnego skryptu działającego na stronie.

 

według mnie trzeba by było "pobawić się" z parametrem z-index we wskazanym kodzie. Obecny parametr:

Powoduje, że przyklejone menu wyświetlane jest na pierwszej warstwie i nachodzi na otwarty obrazek. Sprawdziłbym jaki parametr z-index posiada otwarty obrazek i ustawiłbym tak z-index, aby przy przyklejonym menu wartość była mniejsza niż na obrazku.

 

Tu masz łopatologicznie odemnie

 

dzięki, zmniejszyłem i działa

 

Jakby kto szukał, z-index zmienić na 998.
Proszę, nie ma za co...

 

Sprawdziłem na domyślnym RWD i position: sticky; powoduje, że w wersji mobilnej nie przesuwają się kategorie

 

Zgadza się sticky trzeba na mobilu wyłączać bo nie da się obsługiwać długich kategorii menu.

 

@papux Mam rozwiązanie, Kod działa pod mobile jak nie nie będzie w kodzie top: 0px;