Media Query Min Width example

With media query min-width, we can define how the certain element should behave if the screen size is wider than the given value.

Example:

Let’s say we do want our font size to be 18px. It may be quite a lot for small screens, so let’s apply this only for screens wider than 600px.

<style>
@media screen and (min-width: 600px) {
  body {
    font-size: 18px;
  }
}
</style>

Hello World!

Output:

Hello World!