Responsive Tables Example

Table 1: Basic Data

Name Age City
Alice 30 New York
Bob 25 Los Angeles
Charlie 35 Chicago

Table 2: Four Columns with Long Text

ID Description Notes Status
1 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vitae velit ex. This is a longer note for the first row, providing more context and details about the entry. Active
2 Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus. Second row note: Vivamus luctus urna sed urna ultricies ac tempor dui sagittis. Inactive
3 Phasellus ultrices nulla quis nibh. Quisque a lectus. Donec consectetuer ligula vulputate sem tristique cursus. Third row note: Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc. Pending

Table 3: Two Columns

Country Capital
France Paris
Japan Tokyo
Brazil Brasília

Table 4: Four Columns

ID Name Email Status
1 Jane Doe jane@example.com Active
2 John Smith john@example.com Inactive
3 Emily Clark emily@example.com Active

Table 5: Five Columns

Order Product Quantity Price Date
1001 Monitor 2 $300 2025-07-01
1002 Keyboard 1 $50 2025-07-02
1003 Mouse 3 $75 2025-07-03

Table 6: No Thead Example

Red #FF0000
Green #00FF00
Blue #0000FF

Table 7: Image Gallery with Thead

Image 1 Image 2 Image 3
Gallery 1 Gallery 2 Gallery 3
Gallery 4 Gallery 5 Gallery 6
Gallery 7 Gallery 8 Gallery 9

Table 8: Image Gallery, No Thead

Gallery 10 Gallery 11 Gallery 12
Gallery 13 Gallery 14 Gallery 15
Gallery 16 Gallery 17 Gallery 18