user7956165
user7956165

Reputation:

Target specific resolution and apply css

I want to target specific resolution 1600x900 and apply css only to it. I have tried this

@media only screen and (min-width:1899px) {
  .up { margin-top: -5%;}
}

And this

@media screen and (max-width: 1900px) and (min-width: 1900px) {
  .up { margin-top: -5%;}
}

Both doesn't work and I don't see them in console. Is there any other way to do this?

Upvotes: 1

Views: 721

Answers (2)

Robert Williams
Robert Williams

Reputation: 1410

You are making an error, change the resolution value.

@media screen and (min-width: 1600px) {
    .up {
        background-color: lightgreen;
    }
}

If you don't want to apply styling to the resolution above 1600px use:

@media screen and (width: 1600px) {
        .up {
            background-color: lightgreen;
        }
    }

Upvotes: 1

You can use width to target a specific viewport width.

@media (width: 1600px) {
    .up { margin-top: -5%;}
}

Upvotes: 3

Related Questions