Poprawa wyglądu menu

kibus90
(@kibus90)

7 years, 6 months temu
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:

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 7 years, 6 months temu by kibus90.

Viewing 3 replies - 1 through 3 (of 3 total)

Nikodemsky
(@nikodemsky)

7 years, 6 months temu
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%;
}
}
```
Thread Starter kibus90
(@kibus90)

7 years, 6 months temu
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 🙁
- Ta odpowiedź została zmodyfikowana 7 years, 6 months temu przez kibus90.
- Ta odpowiedź została zmodyfikowana 7 years, 6 months temu przez kibus90.
- Ta odpowiedź została zmodyfikowana 7 years, 6 months temu przez kibus90.
Nikodemsky
(@nikodemsky)

7 years, 6 months temu
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)

Temat ‘Poprawa wyglądu menu’ jest zamknięty na nowe odpowiedzi.

Tagi tematu

Wyświetlenia