Issues with centering text vertically in HTML

Tazr

New Member
I understand this type of question has been posted many times, but I cannot seem to figure out what my issue is. I have a block of text and I want to center it vertically on the left side of the page. I do not want to use heavy padding to center the text. I want it centered vertically if the visitor changes with window height. I have a block of text: \[code\]<div class="welcome"> <p>Testing Stuff</p> <br /> <br /> <p>Testing Stuff</p> <br /> <br /> <p>Testing Stuff</p> <br /> <br /> <p>Testing Stuff</p></div>\[/code\]Here is the CSS for welcome\[code\].welcome {position: absolute;top:50%;display: table;vertical-align: middle;padding-left: 50px;font-family: 'Helvetica-Light';font-size: 40px;}.welcome p{display: inline;vertical-align: middle;padding: 10px;background: black;color: white;opacity: 0.7;white-space: nowrap;}\[/code\]Currently the top:50% sets the text starting at 50% but I need the center of the text block to be at 50%, not start at 50%. Help please.
 
Back
Top