Home Page

Flexbox Responsive Practice

Full Flexbox is demonstrated horizontally for the bigger screen. Full Flexbox is demonstrated vertically for the small screen.

Box One

Highlight Words

Listbox1-list1
Listbox1-list3
Listbox1-list3

Vote

Box Two

Highlight Words

Listbox2-list1
Listbox2-list2
Listbox2-list3
Listbox2-list4

Vote

Box Three

Highlight Words

Listbox3-list1
Listbox3-list2
Listbox3-list3

Vote

Article Responsive Practice

The aside is on the right side of the article for the bigger screen. The aside is below the article for the small screen.

One - Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph

Two - Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph

Three - Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph

Four - Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph

Five - Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph

Six - Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph

Seven - Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph

Eight - Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph Paragraph

4 Grids per row for bigger screens, 3 grids per row for middle screens, 2 grids per row for small screens.

Photo Responsive Practice

60% of screen width when the screen width is bigger then 600px. solid width 300px when screen width is same or smaller then 600px.

Spiral White Stairs By Ludde Lorentz On Unsplash

Other Practice

Contents are demonstrated horizontally on one row for bigger screens. Contents are demonstrated horizontally on two rows for middle screens. Contents are demonstrated vertically for small screens

listlistlist1

listlistlist1listlistlist1

listlistlist1

listlistlist1listlistlist1