Tailwind issue with media queries

user_15894515 0
Viewed 53

I have such queries

 screens: {
        414: { max: "414px" },
        500: { max: "500px" },
        630: { max: "630px" },
        720: { max: "720px" },
        840: { max: "840px" },
        1000: { max: "1000px" },
        1230: { max: "1230px" },
      }

And such element

  <div className="absolute right-0 bottom-0 840:-top-[350px] 500:-top-[150px]"> 
     590 € 
  </div>

And for some reason it doesn't want to override top property

tailwind-css
1 Answers
Maybe you can use this..
But tailwind is use min width not max width
You can read the docuentation here https://tailwindcss.com/docs/screens 
    {
      "screens": {
        "414": "414px",
        // => @media (min-width: 414px) { ... }
        "500": "500px",
        "630": "630px",
        "720": "720px",
        "840": "840px",
        "1000": "1000px",
        "1230": "1230px"
      }
    }
user_171824540
Related