• 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

0 głosów
163 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,130 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,130 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 (38,070 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ź 82 wizyt
pytanie zadane 5 października 2018 w HTML i CSS przez Layoutowiec Gaduła (4,550 p.)
0 głosów
2 odpowiedzi 117 wizyt
0 głosów
4 odpowiedzi 132 wizyt
pytanie zadane 1 grudnia 2018 w HTML i CSS przez Piotr Jarema Użytkownik (530 p.)
Porady nie od parady
Pytania na temat serwisu SPOJ należy zadawać z odpowiednią kategorią dotyczącą tej strony.SPOJ

65,755 zapytań

112,393 odpowiedzi

237,320 komentarzy

46,700 pasjonatów

Przeglądających: 174
Pasjonatów: 3 Gości: 171

Motyw:

Akcja Pajacyk

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

Oto dwie polecane książki warte uwagi. Pełną listę znajdziesz tutaj.

...