Vikram Anand Bhushan
Vikram Anand Bhushan

Reputation: 4886

How to target small phones 3 inch or lesser with media query

I am trying to target small phones like 3 to 3.5 inches for Example:

HTC DESIRE C

using @mediaQUery but not able to do that .

I could target the standard mobile phone width that is as follow.

@media only screen and (min-device-width : 320px) and (orientation : portrait) {
    .bar {
        display:none !important;
    }
}
@media only screen and (min-width : 321px) and (orientation : landscape) {
    /* Styles */
    .par {
        display:none !important;
    }
}

JSFiddle

So what I want to do is show the class .par only when the width of the screen is equivalent to 3inch phones

Upvotes: 1

Views: 657

Answers (1)

charles_p
charles_p

Reputation: 26

Most of the resolution will fall within 320px

So you have to changes min to below code

@media screen and (max-width: 320px){
/*YOUR CODE */
}

Upvotes: 1

Related Questions