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 Responsive Web Design and Testing Adding Breakpoints for Devices

barnabasadedoyin
barnabasadedoyin
1,501 Points
Posted by barnabasadedoyin
barnabasadedoyin
1,501 Points

Nav Menu Position

Hi, after doing all the css on the nav menu bg, I still have it not keeping to the base. How can I solve this? Screenshot: http://awesomescreenshot.com/0e53qvrd7f

regards

Gloria Dwomoh
Gloria Dwomoh
13,116 Points

Can you show us your css code?

barnabasadedoyin
barnabasadedoyin
1,501 Points
barnabasadedoyin
barnabasadedoyin
1,501 Points

Here is the code: /************************************* NAVIGATION *************************************/

nav {
  text-align: center;
  padding: 10px 0;
  margin: 20px 0;
}

nav ul {
    list-style: none;
    margin: 0 10px;
    padding: 0px;
}

nav li {
    display: inline-block;
}

nav a {
    font-weight: 800;
    padding: 15px 10px;
}
John Donnell
John Donnell
7,801 Points
John Donnell
John Donnell
7,801 Points

Did you create the responsive.css file yet?

2 Answers

John Donnell
John Donnell
7,801 Points
John Donnell
John Donnell
7,801 Points

Did you complete the responsive web design and testing course? If you not continue with the course and he shows you how to do this in "adjust profile page and header" video

Gloria Dwomoh
Gloria Dwomoh
13,116 Points
Gloria Dwomoh
Gloria Dwomoh
13,116 Points

According to your code the top and bottom margins are 20 px. If you reduce your bottom margin you can hopefully get it aligned to the place you want.

For example try adding this to your navbar CSS (instead of the one you have) and play with the third value till it is positioned as you want. 

margin: 20px 0 10px;

It is good you continue the course though, and see how it goes. I'm not sure if the instructor has normalize.css or something like that, that might be causing the differences at the moment.