Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

How do I center my text in the middle of the screen?

Hello everyone. I have tried transform:translate(-50%,-50%) and absolute position still I can't find a way to my #center in the middle of the page. Any solution to fix this? Here is my codepen http://codepen.io/Layee/pen/RPKLBY

Try this?

center {

background-color: blue; width: 50%; margin: 0 auto; }

is not working. I added this to it.

#center{
      background:#222;
      height:80vh;
      margin:0 auto;
      width:100%;
}

4 Answers

Did you ever tried the Box-sizing property ??

try using text-align: center; for this

I tried both method still is not my text is not push down.

I figured it out by adding padding-top to the #center div. I appreciate everyone help.

#center {
   padding-top:150px;/* text goes in the middle of the page.*/
  background:#222;
  height:80vh;
}

This may be a temporary solution but is not the correct way of doing this for most situations. I apologize I couldn't be of more help I'm new to this myself.

No worries bro. I thank you for taking your time to help me out.