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

put result on its own row

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

5
index.html
View File

@ -10,12 +10,13 @@
<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"> <div id="modulus-row">
<output id="result" for="expr modulus"></output>
<label for="modulus">mod</label> <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>
<output id="result" for="expr modulus"></output>
<div id="extra-buttons"> <div id="extra-buttons">
<button id="sqrt" type="button">√</button> <button id="sqrt" type="button">√</button>
<button id="inv" type="button">x<sup>-1</sup></button> <button id="inv" type="button">x<sup>-1</sup></button>

23
styles.css
View File

@ -11,27 +11,16 @@ label[for="expr"] {
grid-column: 1 / 5; grid-column: 1 / 5;
} }
#result { #modulus-row {
grid-column: 1 / 4; grid-column: 1 / 5;
border: 1px solid gray;
text-align: right; text-align: right;
} }
#result-row {
grid-column: 1 / 5;
display: flex;
}
#result { #result {
flex: auto; grid-column: 1 / 5;
} border: 1px solid gray;
text-align: right;
#modulus-entry label { min-height: 1.5em;
flex: initial;
}
#modulus {
flex: initial;
} }
#extra-buttons { #extra-buttons {