• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

RWD - Media Queries

Aruba Cloud - Virtual Private Server VPS
0 głosów
587 wizyt
pytanie zadane 1 grudnia 2018 w HTML i CSS przez Piotr Jarema Użytkownik (970 p.)
menu {
    z-index: 99999;
    margin: 15px 0;
    border-top: 1px solid red;
    padding: 0;
    list-style: none;
    text-align: center;
    position: sticky;
    top: 0;
    background-color: whitesmoke;
}

menu li {
    display: inline-block;
    font-size: 14pt;
}

menu li a {
    text-decoration: none;
    color: red;
    padding: 20px;
    display: block;
    border-bottom: 3px solid rgba(255, 255, 255, 0);
    transition: ease-out .25s;
}
@media screen and (max-width: 800px) {
    menu {
        width: 100vw;
    }
}
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="responsive.css" />

No i oczywiście tag na viewport mam, dlaczego zatem menu nie chce się rozciągnąć na full screen?

4 odpowiedzi

0 głosów
odpowiedź 1 grudnia 2018 przez 1234 Dyskutant (9,140 p.)
Może spróbuj zamienić "vw" na "%"
komentarz 1 grudnia 2018 przez Piotr Jarema Użytkownik (970 p.)
To samo
0 głosów
odpowiedź 1 grudnia 2018 przez Tomek Sochacki Ekspert (227,490 p.)
jesli menu nie jest jakis customowym tagiem to chyba powinienes odniesc sie do klasy .menu albo #menu ale lepsze pierwsze rozwiazanie.
komentarz 1 grudnia 2018 przez Piotr Jarema Użytkownik (970 p.)
<menu class="menu">
@media (max-width: 800px) {
.menu {
        width: 100vw !important;
    }}

Już widać chociaż to w konsoli ale still nic się nie dzieje.

0 głosów
odpowiedź 1 grudnia 2018 przez Comandeer Guru (606,920 p.)

Czemu używasz tagu menu? Jeśli to nawigacja, to powinieneś użyć nav.

Niemniej: https://codepen.io/Comandeer/pen/VVgWda – rozciąga się. Możesz pokazać więcej kodu?

0 głosów
odpowiedź 1 grudnia 2018 przez Davidelo18 Użytkownik (660 p.)
Może spróbuj dać wszystko na box sizing: border box

Podobne pytania

0 głosów
2 odpowiedzi 746 wizyt
pytanie zadane 6 marca 2019 w HTML i CSS przez ricksanchez1943 Początkujący (260 p.)
0 głosów
2 odpowiedzi 234 wizyt
pytanie zadane 31 sierpnia 2017 w HTML i CSS przez jacobek02 Nowicjusz (200 p.)
0 głosów
1 odpowiedź 154 wizyt

93,335 zapytań

142,331 odpowiedzi

322,415 komentarzy

62,670 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj

Wprowadzenie do ITsec, tom 1 Wprowadzenie do ITsec, tom 2

Można już zamawiać dwa tomy książek o ITsec pt. "Wprowadzenie do bezpieczeństwa IT" - mamy dla Was kod: pasja (użyjcie go w koszyku), dzięki któremu uzyskamy aż 15% zniżki! Dziękujemy ekipie Sekuraka za fajny rabat dla naszej Społeczności!

...