Webboard

Pełna wersja: Wygląd menu w PW - tryb responsywny.
Aktualnie przeglądasz uproszczoną wersję forum. Kliknij tutaj, by zobaczyć wersję z pełnym formatowaniem.
Powiedzcie jak to ogarnąć. Teraz mam:

[attachment=13496]

Chcę uzyskać to:

[attachment=13497]

czyli jedno obok drugiego.

W stylach mam:

Kod PHP:
.usercp_nav_item, .modcp_nav_item {
displayinline-block;
padding10px 12px;
border-radius3px;
width145px;
text-aligncenter;
background#F9F5EE;
margin0 0 4px 0;
}

.
usercp_nav_pminbox:before {
    content:"\f0e0";
}

@
media only screen and (min-width:0px) and (max-width:479px){
.
wrapper{width:95%;}

.
usercp_nav_item, .modcp_nav_item {
    displayblock;
    widthauto;
    text-alignleft;
}
    


Forum: https://www.akwarystyka-miedziowa.pl
Login: tester
Pass: Abc_123
18 linia w ACP.
Usuń wyświetlanie blokowe (możesz nadać inline-block zamiast obecnego), zmniejsz czcionkę i nadaj margin-right:. Poza tym w linii 8 możesz zmienić width na 100%. Jeśli chcesz to tylko na urządzeniach o małej rozdzielczości, to nic nie zmieniasz. Wtedy tylko kopiujesz całe selektory i nadpisujesz wartości w media. Przykład:

Kod:
@media (max-width:479px) {
  .usercp_nav_item, .modcp_nav_item { width: 100%; }
  .usercp_nav_item:before, .modcp_nav_item:before { display: inline-block; margin: 0; margin-right: 3px; font-size: 13px; }
}