LCARS Button with 2 Lines of Text

Stardate 55216.3 • August 4, 2021

You may run into the situation where you have too much text for the size of your button. Beginning with LCARS 8 you can add the class "two-rows" to the *a* tag and the resulting font will be smaller, and the padding inside the button will allow for 2 rows of text. Just remember to include the <br> tag to separate the two rows of text.


				<div class="buttons">

				  <a href="url" class="two-rows">button top row<br>

				  bottom row</a>

				</div>

Result:

button top row
bottom row

For more information on utilizing LCARS style buttons with the LCARS website template, check out the Buttons page.

go back /
news index