Here's an intriguing and somewhat trivial inquiry:
if I were to create a button tag in HTML, then input some text such as "click me" or something
<button> Click Me! </button>
and proceed to use CSS to assign it width and height, like so:
.myBtn{
width:100px;
height:100px;
}
The phrase "Click Me!" will automatically be positioned right in the center of my button.
Upon trying text-align:left;, the words shift to the left,
effectively disabling its horizontal centering.
However, I am unsure how to make it not vertically centered?
Achieving vertical centering for elements generally involves utilizing various techniques (such as after/before, flexbox, margins, etc.), but today I'm interested in aligning the contents to not be vertically centered within the button,
I am completely clueless about how to achieve this without adjusting its top and left properties.
Does anyone know which attributes I should modify to prevent it from being vertically centered?
By the way, I am only curious about the fundamental attributes that enable content centering within a button, not looking for ways to move the content to the top-left corner, so please refrain from suggesting the use of top, left, calc, or any other positioning calculations, that would be appreciated.