make output row flexbox so operator buttons don't get huge on zoom
This commit is contained in:
parent
8a8dc95c4c
commit
e03df9fb59
|
|
@ -10,9 +10,8 @@
|
||||||
<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>
|
||||||
|
|
||||||
<div id="modulus-entry">
|
|
||||||
<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>
|
||||||
|
|
|
||||||
10
styles.css
10
styles.css
|
|
@ -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 {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue