Home
Anonymous
Question & Answer

Question & Answer

questions and answers

This tailwind example is contributed by Anonymous, on 09-Aug-2023. Component is made with Tailwind CSS v3. It is responsive.

Other

Author Anonymous

7.4k

Fork Fullscreen

<div class="w-full md:w-2/3 mx-auto p-5 bg-white rounded-lg shadow">
  <div class="flex items-center justify-between">
    <div class="w-2/3">
      <h2 class="section-heading text-bold">
        Questions and Answer
      </h2>
    </div>

<p class="ml-4 md:ml-6 text-bold">
          Can we have extra parking space for this unit?
        </p>
      </div>

<p class="ml-4 md:ml-6 text-bold text-gray-800">
          Yes you can get extra parking space but you have to pay extra monthly.
        </p>
      </div>

<span class="text-sm text-gray-800">
              10 upvotes
          </span>
        </div>

<span class="text-sm text-gray-800">
              Jason
              <span class="hidden md:inline-block">
                  - 2 days ago
              </span>
          </span>
        </div>
      </div>
    </div>
    <div>
      <div class="flex items-start">
        <div>
          <span class="inline-flex justify-center items-center w-6 h-6 rounded bg-green-500 text-white font-medium text-sm">
              Q
          </span>
        </div>

<p class="ml-4 md:ml-6 text-bold">
          Can we have extra parking space for this unit?
        </p>
      </div>

<p class="ml-4 md:ml-6 text-gray-800">
          Yes you can get extra parking space but you have to pay extra monthly.
        </p>
      </div>

<span class="text-sm text-gray-800">
              10 upvotes
          </span>
        </div>

<p class="ml-4 md:ml-6">
          Can we have extra parking space for this unit?
        </p>
      </div>

<p class="ml-4 md:ml-6 text-gray-800">
          Yes you can get extra parking space but you have to pay extra monthly.
        </p>
      </div>

<span class="text-sm text-gray-800">
              10 upvotes
          </span>
        </div>

<span class="text-sm text-gray-800">
              Jason
              <span class="hidden md:inline-block">
                  - 2 days ago
              </span>
          </span>
        </div>
      </div>
    </div>
  </div>
</div>

Related Examples

Collapsible content

Author:
Rafferty Kim

1 year ago

12.2k
News feed

Author:
Bunny

1 year ago

12.3k
Show user details

Author:
Lucas Martinez

1 year ago

20.7k
Chat template
fullscreen chat template suitable for mobile devices

Author:
Manon Daniel

1 year ago

14.4k
Fancy underline

Author:
Simon Scheffer

1 year ago

10k
Typewriter animation effect
Build using only Tailwind CSS; no JavaScript is required. This is a continuous typing effect. If you want to stop it after the text is typed for the first time, then you can remove 'infinite' from [typing: 'typing 2s steps(20) infinite alternate, blink .7s infinite'] from the config file.

Author:
Samuel Dawson

1 year ago

15.6k
simple responsive blog layout with sidebar

Author:
Isabella Kowalski

1 year ago

8.1k
background animation
background animation

Author:
Jayendra Madara

3 months ago

960
Play, Pause and Stop buttons

Author:
Lukas Müller

1 year ago

9.6k
Basic Terms of Service Page
Basic Terms of Service Page setup for light and dark mode. Repeat the sections to add as many as you need.

Author:
Monica D.

4 months ago

1.2k
Date picker
Date picker example using flatpickr library

Author:
Lîmåã M

1 year ago

13.9k
Google map iframe with tailwind

Author:
Kofi Osei

1 year ago

18k

Explore components by Tags

Didn't find component you were looking for?

Search from 1700+ componenent