+- Hack Forums (https://hackforums.net)
+-- Forum: Tech (https://hackforums.net/forumdisplay.php?fid=444)
+--- Forum: Webmasters (https://hackforums.net/forumdisplay.php?fid=141)
+---- Forum: Website Construction (https://hackforums.net/forumdisplay.php?fid=50)
+---- Thread: How to verticallly align to center inside table cells? (/showthread.php?tid=5763300)
How to verticallly align to center inside table cells? - FaberCastell - Dec 5, 2017
UPDATE: RESOLVED: style="vertical-align:middle" does the job
So basically to allign to center horizonattally you do <center>something</center>
But how can you make so it's alligned to center vertically as well? (Example, if some cells are bigger, then others look weird and it would be better if it could be alligned to center by vertical as well...)
RE: How to verticallly align to center inside table cells? - nysoc - Dec 5, 2017
<center> </center> is not cross browser supported and is not HTML5, which means is not updated. There are better solutions for centring elements.
You can do it using CSS:
Code
.center {
box-sizing: border-box;
margin-left: auto;
margin-right: auto;
position: relative;
}RE: How to verticallly align to center inside table cells? - Ganja - Dec 5, 2017
I understand you're working with a table. If you want to achieve both vertical and horizontally centering an element without that, you can use display: flex;. Elements with display: flex; can use things like 'justify-content: center;' and 'align-items: center;' or 'align-content: center;'. Note that display:flex; isn't supported by all browsers tho.
A complete guide on the topic can be found here: https://css-tricks.com/centering-css-complete-guide/