You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
26 lines
2.5 KiB
26 lines
2.5 KiB
<!doctype html> |
|
<html> |
|
<head> |
|
<meta charset="utf-8"> |
|
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1"> |
|
<title>Flexbox Demonstration</title> |
|
<link href="flexbox11.css" rel="stylesheet" type="text/css"> |
|
</head> |
|
<body> |
|
<div class="demoheader">This is the layout header</div> |
|
<div class="flex-container"> |
|
<div class="flex-item">1</div> |
|
<div class="flex-item">2</div> |
|
<div class="flex-item">3</div> |
|
<div class="flex-item">4 |
|
<p>Short block of text.</p> |
|
</div> |
|
<div class="flex-item">5 |
|
<p>Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! Longer block of text. Boxes. More boxes. Even more boxes!! </p> |
|
</div> |
|
</div> |
|
|
|
<div class="demofooter">This is the layout footer</div> |
|
</body> |
|
</html> |