CODEWITHSUNDEEP
javascriptjquerycss
M.M
M.M

Reputation: 162

media screen and min-width: 965px and max-width: 965px

@media screen and (min-width: 965px){
   //style here
}
@media screen and (max-width: 965px){
   //some other style
}

every thing works fine in less than or more than 965px but when the screen on 965px bugs appear

is there is any way to fix that

Upvotes: 1

Views: 163

Answers (2)

borbesaur
borbesaur

Reputation: 691

Switch the order and give yourself 1px of leeway between the 2. 

@media screen and (max-width: 964px){
   //some style
}   


@media screen and (min-width: 965px){
   //style here
}

This way, there is no overlap.

Note: It is not recommended to use bot min and max width in screen size queries. If you just use min-width, and list them from smallest to largest, the one below will override the one above it.

Upvotes: 4

Johannes
Johannes

Reputation: 67778

Just change the second one to

@media screen and (max-width: 964px){

that way the y will be kept seperated and won't interfere with each other.

Upvotes: 1

Related Questions