Add new utilities for the positioning of elements in the DOM

[tavo1987]

Hi, how are you.

Testing tailwindcss I found that there were no classes that allow me to center an element on the x or y axis. So I created them. I use them in my day to day with my projects, they have been very useful for me. What do you think ?

But we have to be careful with the responsive, by the transform property, it can cause undesired results, which could be solved by resetting the property : transform: none

[adamwathan]

Hey @tavo1987 first of all thank you so much for the effort put into this, so stoked to see even the tests and documentation were update, awesome job!

I feel horrible for this but I don't think we want to add these utilities to the framework right now for two primary reasons:

1. It relies on transforms combined with positioning to get the right result.

   This is definitely a useful trick but I am not 100% comfortable doing this sort of thing in core, especially because we have plans to add transform utilities down the road and this will conflict with those.

   In general we really want to keep the utilities quite focused on one CSS property or at least very closely related CSS properties. The furthest we've drifted from this so far is the truncate utility, which is about as far as I really feel comfortable going.

2. You can accomplish very similar results right now using pin + Flexbox utilities, for example this:

   <div class="pin-x-auto pin-b"></div>
   

   ...is more or less the same as this for most situations:

   <div class="pin flex justify-center items-end"></div>
   

For those reasons my instinct is to say no to this addition for now, but I would be interested in discussing a few real world examples if you have any to share and seeing if it really is impossible to implement them with the current pin utilities + Flexbox.

Again I really appreciate the effort put into it and you did a great job, I hope you continue to contribute in the future!

[tavo1987]

Hi @adamwathan , do not worry, it was very fun for me to do it. By the way, Tailwindcss is amazing, keep it up.