From 4e80ad2d34f307991562c364b157d1c7a502cd96 Mon Sep 17 00:00:00 2001 From: johannst Date: Fri, 23 Sep 2022 18:29:01 +0000 Subject: deploy: 29c1b6a06f8d5c546fbd5514731c4ac4c504f6c3 --- web/html.html | 218 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 218 insertions(+) create mode 100644 web/html.html (limited to 'web/html.html') diff --git a/web/html.html b/web/html.html new file mode 100644 index 0000000..c7261cd --- /dev/null +++ b/web/html.html @@ -0,0 +1,218 @@ + + + + + + html - Notes + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+ + + + + + + +
+
+

html

+

Collapsible element

+

Rendered html

+
<details>
+  <summary>Some text goes here</summary>
+  ... some more text goes here.
+</details>
+
+
+

With the open attribute <details open> the details are unfolded by default.

+
+

Minimal 2 column layout

+

Rendered html

+
<style>
+.grid-2col {
+  display: grid;
+  grid-template-columns: 2fr 1fr;
+  gap: 1em
+}
+.col1 {
+  grid-column-start: 1;
+  background-color: red;
+  padding-left: 1em;
+}
+.col2 {
+  grid-column-start: 2;
+  background-color: green;
+  padding-left: 1em;
+}
+</style>
+<div class="grid-2col">
+  <div class="col1">
+    <p>Some text in the first column.</p>
+  </div>
+  <div class="col2">
+    <p>Some text in the second column.</p>
+  </div>
+</div>
+
+ +
+ + +
+
+ + + +
+ + + + + + + + + + + + -- cgit v1.2.3