KPC
Kevin Powell - Community•2y ago
Aditya Kirad

difference between these two media query

hey folks what's the difference between these two 
@media (max-width: 600px) {
}
@media (max-width: 600px) {
}
and 
@media only screen and (max-width: 600px) {
}
@media only screen and (max-width: 600px) {
}
and what will happen if remove the only keyword from the second query
6 Replies
Unknown User
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
Aditya Kirad
Aditya Kirad•2y ago
okay so @media screen will target the screen with specified width so only @media will target what
Unknown User
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
Aditya Kirad
Aditya Kirad•2y ago
okay and what's the purpose of and as removing it will make no difference
Unknown User
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
13eck
13eck•2y ago
Right now there are three media query types: all, screen, and print. Your first media query, without a type specified, defaults to all. Your second media query will only work for screen but won't apply any of the styles when printing (or saving as a PDF, since that uses the print functionality on most browsers). For more info, here's the MDN page: https://developer.mozilla.org/en-US/docs/Web/CSS/@media
Want results from more Discord servers?
Add your server
More Posts
Odd anchor behaviorDoes anyone have an idea on why this might be happening? By clicking on: "4th section" (yeah, I knoIdeas to implementing menus in middle of pageHi everyone, i have this simple page I want to show about 12 table inside the blank space; and i newhat do u think about this effect?hello !layout shifting with grid template columnsHello guys! I'm working on a project on react and got confused today, how the child of grid containeOffsetWidth returing an incorrect width?Anyone got any idea why this might be returning a value that's 10 pixels out? The `.slider-containerHow to have an element sized relative to its grandparent *and* be able to move it?Hello! So I'm trying to create an image slider that has 'x' number of visible slides on the screen flex-grow - Maintain aspect ratioSuppose i have the following: ```css .parent { display: flex; flex-wrap: wrap; } .child { widProblems using ParcelAll of a sudden I'm getting a lot of errors trying to run a parcel project that was fine before. I sResponsive navbar bugWhen i switch to the mobile view, the navbar opens and closes quickly and i only want it to open wheissue with using % units while using them to set the height and withHey folks I'm having some issue while using the % units to the height and width of my div etc. This