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

question-closed Media queries nie działa

VPS Starter Arubacloud
0 głosów
805 wizyt
pytanie zadane 14 listopada 2018 w HTML i CSS przez Uzytkowniczka Nowicjusz (220 p.)
zamknięte 14 listopada 2018 przez Uzytkowniczka

Witam,

Czy ktoś może mi pomóc rozwiązać problem z media queries? Nie mam pojęcia dlaczego nie działa ten kod. Poniżej wstawiam fragment kodu

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>hello studio</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">  
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <nav class="container">
        <ul class="navigation__list">
            <li class="navigation__item"><a class="navigation__link" href="#">offer</a></li>
            <li class="navigation__item navigation__item--right"><a class="navigation__link" href="#">photos</a></li>
            <li class="navigation__item navigation__item--left"><a class="navigation__link" href="#">team</a></li>
            <li class="navigation__item"><a class="navigation__link" href="#">contact</a></li>
        </ul>
    </nav>
.container{
    width:80%;
    max-width:60rem;
    margin:0 auto;
}

.navigation__list{
    display: flex;   
    padding: 2% 0;
    justify-content: center;
}
.navigation__item{
    text-align: center;
    flex:1 1 20%;    
}

@media only screen and(max-width:850px){
      .container{
        width:100%;        
    }
    .navigation__list{
        width:100%;
    }  
}

 

komentarz zamknięcia: brakowało spacji, problem rozwiązany

3 odpowiedzi

+2 głosów
odpowiedź 14 listopada 2018 przez arces Pasjonat (17,700 p.)
wybrane 14 listopada 2018 przez Uzytkowniczka
 
Najlepsza

Pomiędzy "and" a nawiasem powinieneś mieć spację

@media only screen and (max-width:850px){

 

komentarz 14 listopada 2018 przez Uzytkowniczka Nowicjusz (220 p.)

Faktycznie. Działa. Dziękuję!smiley

0 głosów
odpowiedź 14 listopada 2018 przez WireNess Stary wyjadacz (11,240 p.)

1. Otwierasz plik normalnie w przeglądarce czy korzystasz z serwera lokalnego typu XAMPP?

2. Z jakiej przeglądarki korzystasz?

3. Czy w innych przeglądarkach to działa?

4. Czy po usunięciu "only screen and" działa?

5. Czy po kliknięciu F12 w stylach pokazuje media queries?

komentarz 14 listopada 2018 przez Uzytkowniczka Nowicjusz (220 p.)
Plik otwieram normalnie w przeglądarce, nie korzystam z serwera lokalnego/zewnętrznego. Korzystam z Google Chrome i Firefox. W obu przeglądarkach w konsoli w stylach pokazuje media queries. I niestety po usunięciu "only screen and" również nie działa..
komentarz 14 listopada 2018 przez WireNess Stary wyjadacz (11,240 p.)
Możesz pokazać wyniki w przeglądarce zarówno bez, jak i z użyciem media queries? Kod wygląda na prawidłowy
0 głosów
odpowiedź 14 listopada 2018 przez jaca121212 Nałogowiec (40,760 p.)
Usuń only powinno zadziałać
komentarz 14 listopada 2018 przez Uzytkowniczka Nowicjusz (220 p.)
Niestety nie działa

Podobne pytania

0 głosów
1 odpowiedź 390 wizyt
pytanie zadane 5 października 2018 w HTML i CSS przez Layoutowiec Mądrala (5,470 p.)
0 głosów
3 odpowiedzi 1,975 wizyt
pytanie zadane 29 września 2017 w HTML i CSS przez Apper97 Obywatel (1,380 p.)
0 głosów
2 odpowiedzi 481 wizyt
pytanie zadane 6 marca 2019 w HTML i CSS przez ricksanchez1943 Początkujący (260 p.)

92,453 zapytań

141,262 odpowiedzi

319,088 komentarzy

61,854 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.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...