PLATFORM
  • Tails

    Create websites with TailwindCSS

  • Wave

    Start building the next great SAAS

  • Pines

    Alpine & Tailwind UI Library

  • Auth

    Plug'n Play Authentication for Laravel

  • Designer comingsoon

    Create website designs with AI

  • DevBlog comingsoon

    Blog platform for developers

  • Static

    Build a simple static website

  • SaaS Adventure

    21-day program to build a SAAS

Question By
Solved

Tails Builder - Reversing Col or Row

Solved
ransomenotes

Jan 28th, 2023 10:10 AM

Hello everyone,

I'm hoping to get some help with an issue I'm currently facing in the Tailwind Builder. I'm trying to flip the position of an image and its corresponding text within the layout, without having to make any changes to the underlying code. I'm working with a client who may not have a lot of experience with HTML or Tailwind CSS, and I want to make it as easy and user-friendly as possible for them. I've heard that using a "col-reverse" class could be one solution, but I'm hoping to find an alternative that's even more straightforward. Any suggestions or tips you may have would be greatly appreciated, thanks in advance!

bobbyiliev

Jan 30th, 2023 01:17 AM

Best Answer

Hey there!

Indeed you are correct! You can use flex-row-reverse to change the flex direction.

To do that, you can:

  • Click on the div that you want to reverse
  • On the right side, under Flexbox & Grid click on the 'Flexbox & Grid' dropdown
  • From the Dropdwon select flex-row-reverse

Here is a quick example:

In case you are interested, you can find more information about this in the Tailwind CSS docs here.

Hope that this helps!