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
Karl Wilke
6,751 PointsNav's float: right in @media screen and (min-width: 660px) is pushing nav right of logo. What is wrong?
Nav's float: right in @media screen and (min-width: 660px) is pushing nav right of logo. What is wrong?
With float: right commented out, I get nav text under the h1 & h2 and a little to the right. Inline image 3
The bottom of responsive.css file for print screen directly above is:
@media screen and (min-width: 660px) {
/*************************************************
Header
**************************************************/
nav {
background: none;
/*
float: right;
*/
font-size: 1.125em;
margin-right: 5%;
text-align: right;
width: 45%;
}
/*
#logo {
float: left;
margin-left: 5%;
text-align: left;
width: 45%;
}
*/
/*
h1 {
font-size: 2.5em;
}
h2 {
font-size: 0.825em;
margin-bottom: 20px;
}
header {
border-bottom: 5px solid #599a68;
margin-bottom: 60px;
}
*/
}
Including float: right, I see the the nav text right of the first item in the #wrapper on the white background section. For the Contact and Index pages, Nav test is right of their h3 text. For Portfolio, the nav test is right of the 1st img. (note: that background: none was commented out for viewability on the white background) Inline image 2
The bottom of responsive.css file for print screen directly above is:
@media screen and (min-width: 660px) {
/*************************************************
Header
**************************************************/
nav {
/*
background: none;
*/
float: right;
font-size: 1.125em;
margin-right: 5%;
text-align: right;
width: 45%;
}
/*
#logo {
float: left;
margin-left: 5%;
text-align: left;
width: 45%;
}
*/
/*
h1 {
font-size: 2.5em;
}
h2 {
font-size: 0.825em;
margin-bottom: 20px;
}
header {
border-bottom: 5px solid #599a68;
margin-bottom: 60px;
}
*/
}
1 Answer
Steven Parker
231,269 PointsThis CSS seems incomplete and the HTML is not present at all.
If this is from a workspace, you can make a snapshot of it and post the link here.