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
Peter Hearne
6,803 Pointshelp with logo id in header
hello, i am finding that my logo link escapes the boundaries of the actual text and is still clickable when cursor is on the other side of the header bar, here is the html
```<a href="index.html" id="logo"> <h1>Peter Hearne<h1> </a>
here is css
```#logo {
text-align: left;
text-decoration: none;
font-size: 0.5em;
font-family: arial;
}
5 Answers
Jason Anello
Courses Plus Student 94,610 PointsThe link is wrapping a block level element. Which is ok in html5. Before, it wasn't ok to do that.
Unless you've defined a width on the h1 (which is a bad idea because then your user's can't increase the font size without the text spilling out of it's container) the h1 will take up the full width of it's parent container.
To stop this you can change the display of the h1 to inline-block.
#logo h1 {
display: inline-block;
}
Jon Sanchez
6,625 PointsIf you're looking to make just the text clickable instead of the entire header, just put....
<div id="logo">
<a href="index.html"><h1>Peter Hearne</h1></a>
</div>
If you don't want to do that, I'd recommend adding a height/width attribute to your css for the logo ID.
Hope this helps! :)
Jon Sanchez
6,625 PointsHey, I was having trouble with the Markdown cheatsheat. Hope you still understood what I was saying!
Peter Hearne
6,803 Pointsthank you :) it worked straight away
Peter Hearne
6,803 Pointsthank you both! :)