The index page CSS is foxden_home.css so you can see the changes I made for each page.
I think you should use one style sheet, the same for all pages. That will prevent overseeing conflicting rules and will make it easier to make changes to the site. A good advice could be to organize the style-sheet according to the html. E.g. starting with styling the generic elements and then the class or id rules in the same order the elements are appearing in the html code.
I took out the sidebar bacause I didn't need it for the about page. Could this be the problem? I put it back in and the text is at the top where it belongs but the sidebar is not needed so how would I fix this?
Yes, when the rule for the sidebar is missing in the about style-sheet, as default the sidebar div stretch to fit the width of the page and holding the empty list it is pushing content down. The unused sidebar would rather be removed from the html.
To handle different needs in different pages using the same style-sheet you can use a common method:
Give all pages an id on the body tag:
HTML Code:
<body id="page-home">
HTML Code:
<body id="page-about">
Then you can use the page id when you need to target a common element only for that page.
E.g.: if you in the future need to indicate current page when navigating the site, you can target the link that is the current page:
Code:
ul#nav li a:hover{ margin:0 -10px 0 10px;}
#page-home #nav-home a{ margin:0 -10px 0 10px; cursor:default;}
#page-about #nav-home a{ margin:0 -10px 0 10px; cursor:default;}
Bookmarks