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 Styling Web Pages and Navigation Build Navigation with Unordered Lists

Header floats left (images to its right) after adding header {width: 100%}

I followed exactly the video code but my header seems to get all huddled up in the top left corner (tested in firefox, explorer & chrome). Everything seems to work like the video only when I remove the width: 100% in the header selector. What could I have missed?

1 Answer

Hi,

Are you doing this in workspaces? If so could you fork it so we could take a look at your code?

Hi, Mark yes I'm using workspaces. Here is the fork: https://teamtreehouse.com/workspaces/20593132. Thanx in advance.

Hi Tawanda,

I meant snapshot vs fork. I am unable to take a look at the link you attached. My apologies.

Ok sorry I'm new to treehouse haven't quite understood snapshots and forks yet. hope this link works. https://w.trhou.se/60hl37rv8o Got it after clicking the snapshot button.

No worries. That was my fault. You have to snapshot so it can be forked. I jumped the gun and skipped a step.

Hi Tawanda,

Taking a look at the code you are missing width: 100%; You have max-width: 100%;

Having max-width: 100% is generally a good practice as it will help keep things inside of their containers. Example: Header image is 2000px wide but viewport/screen is 1903px wide.

You can also download the files below the video to compare yours to it.

Wow thanx Mark! I don't know how I missed that. Spent yesterday night and the whole of today looking at that header selector but missed the max-width. Its now working perfectly like the video!

No worries at all and that is part of the fun with coding. If you dive into programming depending on the language it could be something as simple as a , or ; missing from multiple lines of code.

Also please mark as answered, this helps others know this question/issue was already resolved and if they had a similar issue they know they can look here to see the fix/answer.

Ok thanx will do.