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

CSS

Posted by Denis Murphy
Denis Murphy
14,388 Points

White Space on the top of my about page.

I also have extra white space on the top of my About section that I can't seem to get rid of, even though the other 2 pages are OK. I have a normalise.css file.

This is my responsive.css code with the code suggestion on the previous question about this topic included:

/*****************************
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;

    }

    *{
margin: 0px;
padding: 0px;
}

}

This is my main.css code for Heading and Nav.

/*****************************
Heading
*****************************/

header {
  float: left;
  margin: 0 0 30px 0;
  padding: 5px 0 0 0;
  width: 100%;
}

#logo {
text-align: center;
margin: 0;
}

h1 {
  font-family: 'Changa One', sans-serif;
  margin: 15px 0;
  font-size: 1.75em;
  font-weight: normal;
  line-height: 0.8em;
}

h2 {
  font-size: 0.75em;
  margin: -5px 0 0;

  font-weight: normal;
}



/*****************************
Navigation
*****************************/

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

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

nav li {
  display: inline-block;
}

nav a {
  font-weight: 800;
  padding: 15px 10px;
}

I am not sure I inputted the previous response to this question correctly as I think *may need to be referenced somewhere in my html style, but it looks exactly the same anyway as what I had.

Thanks, Denis.

Ryan Duchene
Ryan Duchene
Courses Plus Student 46,022 Points

I edited your post to add syntax highlighting. :)

Denis Murphy
Denis Murphy
14,388 Points

Hi Ryan,

Thanks for that, looks a lot better! I actually have resolved my issue; there were 2 semi colons missing in my main.css text, I have since put them in and the header on the 'about' page looks the same as the rest.

Thanks, Denis.