Add these to your CSS stylesheet as necessary.
CSS to be used only on Mobile devices
This CSS will be used when the screen width is less than 576px.
@media screen and (max-width: 576px) {
.selector {
property: value;
}
}CSS to be used on anything BUT Mobile phones
This CSS will be used when the screen width is greater than 576px.
@media screen and (min-width: 576px) {
.selector {
property: value;
}
}CSS to be used only on Tablets
This CSS will be used when the screen width is between 576px and 768px.
@media screen and (min-width: 576px) and (max-width: 768px) {
.selector {
property: value;
}
}
I am a WordPress product developer and creator of Image Attributes Pro. I am passionate about solving problems and travelling the world.
Hello Arun Basil Lal,
Thanks for the blog post, you are really a life saver, your method for finding screen size based on CSS helped me to solve one problem in my WordPress theme, once again thank you
Glad to hear Edward!