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

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

Jeffrey Cunningham
Jeffrey Cunningham
5,592 Points
Posted by Jeffrey Cunningham
Jeffrey Cunningham
5,592 Points

Why can't you see the logo ID a element like you can the wrapper div?

When creating the wrapper div we were able to color it orange and consequently we could see the margin, padding ect. in Dev tools. With the logo ID there is no way to visualize the padding and margin. You cannot change the background color or view it in Dev tools. Just wondering why.

2 Answers

Arthur Boilanger
Arthur Boilanger
3,372 Points
Arthur Boilanger
Arthur Boilanger
3,372 Points

Jeffrey, if I'm remembering correctly, the reason you can't see anything changing like that is because you are styling what is essentially a link.

If you were to move the 

 id="logo"

portion up to the 

<header>

opening tag, you should be able to see all of that change. It would also style the rest of the header to move into the middle. For example:

  <header id="logo">
      <a href="index.html">
        <h1>Arthur Boilanger</h1>
        <h2>Designer</h2>
      </a>
      <nav>
        <ul>
          <li><a href="index.html">Portfolio</a></li>
          <li><a href="about.html">About</a></li>
          <li><a href="contact.html">Contact</a></li>
        </ul>
      </nav>
    </header>
Alexander Nortung
Alexander Nortung
6,930 Points
Alexander Nortung
Alexander Nortung
6,930 Points

When viewing the bakground of an element you cannot see the margin, this is because, margin is applied "outside" the element, so you will only see the element itselfs and padding background, keep in mind padding applies space inside an element and margin applies outside.

Jeffrey Cunningham
Jeffrey Cunningham
5,592 Points
Jeffrey Cunningham
Jeffrey Cunningham
5,592 Points

I don't think I explained this right. What I'm saying is that in the video example we can view the div wrapper element in dev tools, we can also add color to the background like this:

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

}

However, in the next part of the video when we give the a element an id, when you try to see that in dev tools you cannot see anything. Furthermore, you cannot change its background.

Alexander Nortung
Alexander Nortung
6,930 Points
Alexander Nortung
Alexander Nortung
6,930 Points

I'm not sure.. We can't see the id in html or the styles Aplied from CSS or?