Wsparcie » Motywy » Poprawa wyglądu menu

  • Witajcie Moi drodzy,
    Moja strona to:

    https://goo.gl/VpKFt9

    W widoku mobilnym (trzeba zmniejszyć okno przeglądarki) menu zmienia się w przycisk i logo nad nim. Przeglądając stronę na telefonie jest to uciążliwe że jest to takie duże. I chciałbym zrobić coś takiego:

    http://i.imgur.com/5eIZQcG.png

    Próbowałem na kilka sposobów, ale nie udaje mi się. A jak udaje się, to menu otwiera się niepoprawnie. Czy ktoś mógłby mi pomóc to jakoś ogarnąć? Z góry bardzo dziękuję za pomoc.

    • This topic was modified 4 years, 2 months temu by kibus90.
Viewing 3 replies - 1 through 3 (of 3 total)
  • Jest to prawidłowe zachowanie menu i w większości przypadków tak to działa. Mieszanie w tym nie jest dobrym pomysłem.

    Jeśli koniecznie chcesz, to możesz zacząć od dodania do CSS:

    @media (max-width: 979px) { 
    .navbar .brand { 
        display: inline-block !important; 
        width: 50%; }
    .nav-collapse.collapse {
        display: inline-block !important;
        height: auto !important;
        width: 50%;
    }
    }

    Super jest, ale problem w tym wypadku polega, że rozwijane menu dostosowywuje się do położenia przycisu. A czy jest możliwość aby menu rozwijane się nie zmieniało do przycisku? 🙂

    np. dla:

    .ubermenu-responsive-toggle, .ubermenu-sticky-toggle-wrapper {

    zmienić: max-width: 70%;

    dla:

    .navbar .brand { zmieniam: text-align: right;

    Wtedy wyświetla się przycisk z lewej strony menu, a menu rozwija się poprawnie po całości strony. Ale jak teraz logo przenieść po prawej stronie tego przycisku i aby było one równe z przyciskiem? Bo wszelkie próby i nie daję rady 🙁

    http://i.imgur.com/ZmeKzSi.png

    • Ta odpowiedź została zmodyfikowana 4 years, 2 months temu przez kibus90.
    • Ta odpowiedź została zmodyfikowana 4 years, 2 months temu przez kibus90.
    • Ta odpowiedź została zmodyfikowana 4 years, 2 months temu przez kibus90.

    To nie jest poprawne wyświetlanie, logo masz nad menu dlatego, że menu mobilne jako kontener zajmuje według twojego ustawienia całą szerokość, włącznie z przyciskiem menu.

    max-width nie działa w taki sposób, jak ci się wydaje. Odnosi się on do maksymalnej szerokości, którą może wykorzystać względem pojemnika-rodzica.

    Nie jest to zgodne ze sztuką ale jeśli chcesz uzyskać swój efekt, to dodaj do CSS:

    @media (max-width: 979px){
    .navbar .brand {
        margin: 0
        width: 34%;
        display: inline-block;
        padding: 0;
    }}
    
    @media screen and (max-width: 959px) {
    .ubermenu-responsive-default.ubermenu-responsive.ubermenu {
        margin: 0;
        margin-left: -50%;
    }}
    
    .nav-collapse.collapse {
        display: inline-block;
        height: auto !important;
        width: 66%;
        padding-top: 1.5%;
    }

    dorzuć importanty jeszcze gdzieś, jeśli zajdzie potrzeba.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Poprawa wyglądu menu’ is closed to new replies.