Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS How to Make a Website CSS: Cascading Style Sheets Take a Mobile-First Approach

Kiersten Backs
Kiersten Backs
602 Points

Why is my text not centering?

I'm not sure why my text is not centering... here is my html and css.

  <body>
    <header>
      <a href="index.html" id="logo">
        <h1>Kiersten Backs</h1>
        <h2>Designer</h2>
      </a>
      <nav>
        <ul>
          <li><a href="index.html">Portfoloio</a>
          </li>
          <li><a href="about.html">About</a>      
            </li>
          <li><a href="contact.html">Contact </a>
            </li>
        </ul>
      </nav> 
    </header>
a {
  text-decoration: none; 
}

#wrapper {
  max-width: 940px; 
  margin: 0 auto;
  padding: 0 5%;
}

#logo {
  text-align: center; 
  margin: 0; 
}
Craig Schlegel
Craig Schlegel
12,268 Points

When you select a class or an id you have to add a "." before the class or "#" for id names. Here is an example:

#logo {
  // logo id styles
}

.logo {
  // logo class styles
}

4 Answers

Tomy Lim
Tomy Lim
4,571 Points

Greetings,

h1 and h2 are centered, are you trying to center the nav?

Fred Sites
Fred Sites
11,151 Points

Where is your Id #wrapper in the html? You're applying the css right to #wrapper but I'm not seeing that in the html. If you want the #logo text to be centered it is centered inside of what contains it. In your case is the header. So make sure that is centered on the screen, then center your text within #logo.

Tomy Lim
Tomy Lim
4,571 Points

Greetings,

h1 and h2 are centered, are you trying to center the nav?

Kiersten Backs
Kiersten Backs
602 Points

for some reason it is only centering on my screen after I click on the header link... it does not show up originally centered.

well same here, i typed the same code as the video propose and for some reason is not working at all

Kiersten Backs
Kiersten Backs
602 Points

I am not sure why it was not working before.. but now it is working.