Good resources
https://blog.logrocket.com/13-ways-to-vertical-center/
Classic align middle method
.the_style_of_the_container {
position: relative;
}
.the_style_of_my_element{
position: absolute;
top: 50%;
transform: translateY(-50%); /*For text can need 54%*/
}
The translateY repositions the element vertically so that it becomes centered at the 50% point itself
For center aligned text:
.the_style_of_my_element{
position: absolute;
top: 50%;
transform: translateY(-50%); /*For text can need 54%*/
text-align: center;
width: 100%;
}
Place an image in the center of the browser window
<div style="top:0; right:0; bottom:0; left:0; position:fixed !important; position:relative;">
<div style="position: absolute; top: 50%; transform: translateY(-50%); height: 200px; width:100%;">
<div style="width:200px; margin-left:auto; margin-right:auto; text-align:center;">
<img src="images/logo.png" width="200" height="200" alt=""/>
</div>
</div>
</div>
Placing text at the bottom of the screen
<div style="top:calc(100vh - 16px); right:0; bottom:0; left:0; position:fixed !important; position:relative;">
<div style="text-align:center; font-size:10px;">
<span>Links</span>
</div>
</div>
Feel free to comment if you can add help to this page or point out issues and solutions you have found. I do not provide support on this site, if you need help with a problem head over to stack overflow.