Course Content
Tailwind CSS for Web Development
Tailwind CSS for Web Development
1. Introduction and Setup
3. Building Basic Components
5. Responsiveness and Customization
Challenge: Flexbox Utilities
Task
Complete the provided HTML structure by filling in the missing Tailwind CSS classes according to the layout requirements.
- Parent div: Set the display to flex, and arrange the items in a column;
- Child divs: Center the items horizontally and vertically within the container.
index.html
For the parent div
,
- Use
flex
to set an element to use Flexbox for its layout; - Use
flex-col
to place items in a column; - Use
items-center
to align items to the center; - Use
justify-center
to align items to the center.
index.html
Everything was clear?
Thanks for your feedback!
Section 4. Chapter 4