I am making a Nextjs React website. When I serve the react app and go to the localhost, the tailwindcss works fine. However, when I go to the website hosted by vercel, it does not work and the property does not show up on the developer tools. The property that is not working is text-right.
Here is the link to the website: holocaust-project.vercel.app *Note it is for a school project
You will notice that on the website, all of the sections are aligned on the left. However, when I serve it the sections alternate alignement from right to left (what I am trying to do).
Here is my github: https://github.com/NolanKnight/holocaust-project/
My main code is on the layout.tsx file: https://github.com/NolanKnight/holocaust-project/blob/main/src/components/layout.tsx
I found that the problem was that the prettier plugin for tailwindcss was rearranging the classNames, so in section.tsx on line 14, grid was moved after place-items-. I solve the problem by replacing "end" and "start" in the terenary with the whole property: place-items-end and place-items-start.