From bee04a0929519d1eb48aa2ff02830d6acff6ba0c Mon Sep 17 00:00:00 2001 From: oldoc63 Date: Sun, 20 Feb 2022 08:08:45 -0400 Subject: [PATCH] Any element can be a flex container #551 --- flex/index.html | 37 +++++++++++++++++++++++++++++++++++++ flex/style.css | 31 +++++++++++++++++++++++++++++++ 2 files changed, 68 insertions(+) create mode 100644 flex/index.html create mode 100644 flex/style.css diff --git a/flex/index.html b/flex/index.html new file mode 100644 index 0000000..45bf6a4 --- /dev/null +++ b/flex/index.html @@ -0,0 +1,37 @@ + + + + + Flex + + + + + +

Display: Flex

+
+
+

1

+
+
+

2

+
+
+

3

+
+
+

Display: Block

+
+
+

1

+
+
+

2

+
+
+

3

+
+
+ + + diff --git a/flex/style.css b/flex/style.css new file mode 100644 index 0000000..a28c72e --- /dev/null +++ b/flex/style.css @@ -0,0 +1,31 @@ +body { + margin: 0; + border: 0; + font-family: 'Roboto Mono', monospace; + } + + h1 { + font-size: 18px; + text-align: center; + } + + h2 { + font-size: 16px; + text-align: center; + } + + .container { + background-color: whitesmoke; + } + + .box { + background-color: dodgerblue; + height: 100px; + width: 100px; + border: 1px solid lightgrey; + } + + #flex { + display: flex; + } + \ No newline at end of file