What is wrong in the syntax of my media queries?


Warning: count(): Parameter must be an array or an object that implements Countable in /home/styllloz/public_html/qa-theme/donut-theme/qa-donut-layer.php on line 274
0 like 0 dislike
9 views
Hi, guys. I understand that most likely everything is just like 5 cents, but I don't understand why when you check the syntax errors are in the rows with the names of the media queries ? My eyes blurry, don't understand what's wrong. Pliz explain (
5aedf861505bd277511619.png
/* Large desktop */ @media (min-width: 1200px){ } /* Portrait tablet to landscape and desktop */ @media (min-width: 768px) and (max-width: 979px) { .change_order { display: flex; flex-direction: column-reverse; } /* Landscape phone to portrait tablet */ @media (max-width: 767px){ /*Second section*/ .feach-wrap{ flex-direction:column; padding-bottom:14vw; } .feach { width: 90%; flex-direction:row; text-align:left; margin:10vw 10vw 10vw 0vw; } .feach h3,p { display:inline-block; } .text-part{ display:flex; flex-direction:column; margin-left:5%; } .feach.first1 { margin-left: 10vw; } .warum{ transform:none; writing-mode: lr-tb; width:100%; font-size:32px; line-height:3; margin-bottom:7vw; } .feach-wrap{ flex-direction:column-reverse; } /*Menu*/ #main-header{ position:fixed; top:0; z-index:1000; } .change_order { display: flex; flex-direction: column-reverse; } /* Landscape phones and down */ @media (max-width: 480px){ body { background-color:red; } .video-no-padding .et_pb_row .et_pb_row_3 .et_pb_row_fullwidth{ padding-top: 0px!important; } /*Second section*/ .feach-wrap{ flex-direction:column-reverse; align-content:center; align-items:center; } .warum{ transform:none; writing-mode: lr-tb; width:100%; font-size:24px; margin-bottom:22vw; } .feach{ width:80%; flex-direction:column; margin: 0 0 0 12vw; padding-right: 0; justify-content:center!important; align-items:center; } .feach img { width: 60%; } .text-part{ align-content:center; width:100%; justify-content:center!important; align-items:center; margin-top:5%; text-align:center; margin-left:0; } .feach.first1 { margin-left: 0; } /*Partners*/ .partners img{ width:240px!important; } /*info-service*/ .op2 { margin-bottom:0px!important; } /*Video*/ .feach h3, p{ display:block; line-height:2em; } .rhomb { width: 20vw!important; height: 24vw!important; margin-top:-14vw!important; margin-left:4vw!important; flex-direction:column; } .price-rhomb p{ display:block; font-size:8vw; color:white; text-transform:uppercase; line-height:0.55; } .price-rhomb span{ font-size:35%; margin-top:-24px; } /*Contact*/ .phone p:before{ margin:-12px 12px 0 0; } .adress p:before{ margin:-12px 12px 0 0; } .email p:before{ margin:-12px 12px 0 0; } .phone p.adress p .email p{ line-height:1.3 em; } .features-item img{ margin-top:7%!important; } .change_order { display: flex; flex-direction: column-reverse; } .features-item p{ font-size:12px!important; color:red; } .features{ background-color:red!important; } .test h1{ color:green; }
by | 9 views

1 Answer

0 like 0 dislike
if I understand correctly, you seem to have some media queries incorrectly closed, do not have enough closing braces. should be like this:

@media (max-width: 767px) { .selector { properties }; }


Check )
by

Related questions

0 like 0 dislike
1 answer
asked May 21, 2019 by freshik312
0 like 0 dislike
1 answer
0 like 0 dislike
3 answers
0 like 0 dislike
2 answers
110,608 questions
257,186 answers
0 comments
35,405 users