hendy0817
hendy0817

Reputation: 1079

How to use the `margin: y x;` shorthand in Tailwind?

In Tailwind CSS if I use a utility for calc such as:

right-[calc(-50vw+50%)]

this works as expected. I have some attributes I am trying to add to an element but can't seem to figure out how to get it work using tailwind utilities:

 .element {
    width: 100vw;
    max-width: 100vw;
    margin: 0 calc(-50vw + 50%);
  }

Upvotes: 3

Views: 369

Answers (2)

Vinay SIngh
Vinay SIngh

Reputation: 31

Use like below. you use can square brackets to set custom CSS

class="my-0 mx-[calc(-50vw_+_50%)]"

Upvotes: 0

ATP
ATP

Reputation: 3249

Use my and mx:

class="my-0 mx-[calc(-50vw_+_50%)]"

Upvotes: 4

Related Questions