You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
24 lines
752 B
24 lines
752 B
4 years ago
|
<p>Once again we have the common "panel/card/tile" container theme. There's not much new here except for the way I made the buttons take up an entire strip on the bottom:</p>
|
||
|
|
|
||
|
|
<pre>
|
||
|
|
<code class="language-css">
|
||
|
|
panel bottom {
|
||
|
|
flex-shrink: 0;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: row;
|
||
|
|
justify-content: space-evenly;
|
||
|
|
}
|
||
|
|
|
||
|
|
panel bottom button {
|
||
|
|
display: flex;
|
||
|
|
margin: 0;
|
||
|
|
border-radius: unset;
|
||
|
|
width: 100%;
|
||
|
|
justify-content: space-evenly;
|
||
|
|
}
|
||
|
|
</code>
|
||
|
|
</pre>
|
||
|
|
|
||
|
|
<p>The key to this is setting <b>justify-content: space-evenly</b> on the containing <b>panel bottom</b>, then set the width of each button to 100% with <b>width: 100%</b>. There are other ways to force the buttons to max width, but I've found width:100% is the most reliable method.
|
||
|
|
</p>
|