Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I combine two media queries?

How do I combine two media queries? One is for smaller devices and one for bigger devices, but only in portrait mode!

 @media only screen  and (min-device-width : 320px)  and (max-device-width : 480px)  and (orientation : landscape){ #div {margin-top: 20px;} }  } @media only screen  and (min-device-width : 481px)  and (max-device-width : 1024px)  and (orientation : portrait){ {margin-top: 20px;} } 
like image 633
user2961970 Avatar asked May 27 '14 20:05

user2961970


Video Answer


1 Answers

Not fully clear what you want to combine, but basically you separate them with a comma

eg

@media only screen and (orientation : landscape) , only screen and (min-device-width : 481px) and (orientation : portrait) { ... 
like image 159
Rob Sedgwick Avatar answered Oct 09 '22 00:10

Rob Sedgwick