Question 209647 in CSS Question posted in
Some basic documentation can be found here.

Css – tailwind arbitrary value class specificity issue

I’m using tailwindcss 3.3.3 and having an issue with tailwind arbitrary value specificity that it does not override the generic value.
For example, I have this element <div className="w-full w-[80px]">Sample</div>.
I expect that div will have 80px width but I got width 100% is taking precedence over width 80px.

Tags:

2

Answers


  1. 0

    what do you get if you try to put w-[80px] first and then w-full ?

    Login or Signup to reply.
  2. 0

    You can use an arbitrary variant to force the 80px width to apply.

    <div className="w-full [&]:w-[80px]">Sample</div>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search