filifa
/
mcalc
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

make output row flexbox so operator buttons don't get huge on zoom

This commit is contained in:
filifa 2025-12-11 23:49:34 -05:00
parent 8a8dc95c4c
commit e03df9fb59
2 changed files with 10 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
index.html
View File

@ -10,10 +10,9 @@
<label for="expr">Expression</label> <label for="expr">Expression</label>
<input id="expr" required type="text" /> <input id="expr" required type="text" />
<div id="result-row">
<output id="result" for="expr modulus"></output> <output id="result" for="expr modulus"></output>
<label for="modulus">mod</label>
<div id="modulus-entry">
<label for="modulus"> mod </label>
<input id="modulus" required type="number" min="1" step="1" /> <input id="modulus" required type="number" min="1" step="1" />
</div> </div>

10
styles.css
View File

@ -17,17 +17,21 @@ label[for="expr"] {
text-align: right; text-align: right;
} }
#modulus-entry { #result-row {
grid-column: 4; grid-column: 1 / 5;
display: flex; display: flex;
} }
#result {
flex: auto;
}
#modulus-entry label { #modulus-entry label {
flex: initial; flex: initial;
} }
#modulus { #modulus {
flex: auto; flex: initial;
} }
#extra-buttons { #extra-buttons {