media query applies to desktop screens
hello so im coding some media query and i did some for 360px width the problem is its interfring with my desktop screens that are 1920x1080 and 1440x900 i want the query to affect the screen of 360px max width please help
@media only screen and (max-width: 360px){
.first-four{
display: inline-table;
}
.last-three{
display: inline-table;
}
.ccz{
display: inline-table;
}
.item{
padding: 15px;
}
.welcome{
font-size: 55px;
}
.c1,
.r1,
.c2,
.c3,
.w,
.c4,
.s1,
.y1,
.c5{
font-size: 14px;
}
.text2{
font-size: 15px;
}
.text{
font-size: 35px;
}
.he{
font-size: 35px;
}
li a{
font-size: 20px;
}
.p3,.t4,.p2,.t3,.v,.t2,.s,.e,.c,.p,.t,.e,.r,.m{
font-size: 14px;
}
.acc{
font-size:35px;
}
.item{
font-size: 15px;
}
.cc3{
font-size: 35px;
}
.nhebek{
height: 300px;
position: relative;
left: 4vw;
bottom: 1vw;
}
html{
overflow-x: hidden;
}
.bla{
height: 45px;
}
}
.s1,
.y1,
.c5{
font-size: 14px;
}
.text2{
font-size: 15px;
}
.text{
font-size: 35px;
}
.he{
font-size: 35px;
}
li a{
font-size: 20px;
}
.p3,.t4,.p2,.t3,.v,.t2,.s,.e,.c,.p,.t,.e,.r,.m{
font-size: 14px;
}
.acc{
font-size:35px;
}
.item{
font-size: 15px;
}
.cc3{
font-size: 35px;
}
.nhebek{
height: 300px;
position: relative;
left: 4vw;
bottom: 1vw;
}
html{
overflow-x: hidden;
}
.bla{
height: 45px;
}5 Replies
there's too many for me to bother counting them, but are you sure you're not missing your closing bracket for the media query?
Otherwise, you may have to share this in something like codepen or even just a live version of the site
YOOOO IT WORKED
HOLY
THANK YOU GOAT
THANK YOU SO MUCH
HAVE A GREAT DAY
as a pro-tip: Always, always format your code properly. Use a plugin like prettier to do it for you if you want, but this kind of bug just can't happen as easily if you have your code indented properly all the time
and no worries, glad to help 🙂
everyone says to format my code what is that and do they mean format it to discord?
formatting in this case mostly just means using proper indentation and spacing. This bit tipped me off something was wrong:
because the
.c1 is at the same column as the closing bracket on the welcome class. That usually means that you maybe deleted something but included the ending bracket by accident.
If you'd put the .c1 back on its own line, it would have been very obvious that there's a closing bracket that isn't on the first column, meaning you're still inside another block of code