eric/the-monospace-web-pandoc
1
0
Fork 0
mirror of https://github.com/frainfreeze/the-monospace-web-pandoc synced 2025-12-29 18:49:50 -08:00
Code Issues Packages Projects Releases Wiki Activity

consider input type radio too

Browse Source
This commit is contained in:
Andreas
2024-08-28 22:54:13 +02:00
committed by Oskar Wickström
parent d97979f0c9
commit 30326d1be4
2 changed files with 12 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
index.css
View File

@@ -311,7 +311,8 @@ input, button, textarea {
-webkit-appearance: none; -webkit-appearance: none;
} }
input[type=checkbox] { input[type=checkbox],
input[type=radio] {
display: inline-grid; display: inline-grid;
place-content: center; place-content: center;
vertical-align: top; vertical-align: top;
@@ -319,7 +320,8 @@ input[type=checkbox] {
height: var(--line-height); height: var(--line-height);
cursor: pointer; cursor: pointer;
} }
input[type=checkbox]:checked:before { input[type=checkbox]:checked:before,
input[type=radio]:checked:before {
content: ""; content: "";
width: 1ch; width: 1ch;
height: calc(var(--line-height) / 2); height: calc(var(--line-height) / 2);

8
index.md
View File

@@ -134,6 +134,14 @@ And inputs:
<label>Age <input type="text" value="30" /></label> <label>Age <input type="text" value="30" /></label>
</form> </form>
And radio buttons:
<form class="grid">
<label><input name="radio" type="radio" /> Option #1</label>
<label><input name="radio" type="radio" /> Option #2</label>
<label><input name="radio" type="radio" /> Option #3</label>
</form>
## Grids ## Grids
Add the `grid` class to a container to divide up the horizontal space evenly for the cells. Add the `grid` class to a container to divide up the horizontal space evenly for the cells.