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
Josh Conner
2,851 Points1 CSS for every page isn't working out
I am using a main css for site wide layout. I am having a issue with the font sizes being different for each page. I erased all of my font-size: so my normalize.css would take the reins back but that does not seem to change anything. I ran my css through w3c jigsaw and it came back with no errors same with my responsive css (I also removed font-size: for there too ). I am lost at this point. I really don't want to start over.
6 Answers
Joe Bruno
35,909 PointsLinks? Code? Also, It is possible that your browser (or hosting server?) has cached the page. Are you working locally? Either way, try deleting your history and emptying all caches. If that doesn't work, post your code.
Josh Conner
2,851 PointsYes, I am working locally. I also tried deleting the cache and history and that did not work :(
/*********************************
GENERAL
*********************************/
a {
text-decoration: none;
}
body {
font-family: 'Open Sans', sans-serif;
}
h1, h2 {
text-align: center;
}
#wrapper {
max-width: 940px;
margin: 10px auto;
padding: 0 5%;
}
img {
max-width: 100%;
}
/*******************************
Heading
**********************************/
header {
float: left;
margin: 0 0 30px 0;
padding: 5px 0 0 0;
width: 100%;
}
#logo {
display: block;
max-width: 233px;
max-height: 60px;
width: 45%;
height: 45%;
margin: 0 auto;
padding: 0;
}
/**************************
Navigation
***************************/
nav {
text-align: center;
padding: 10px 0;
margin: 0 0;
margin-top: 20px;
margin-bottom: 10px;
border-top: 1px dashed #3B342A;
border-bottom: 1px dashed #3B342A;
}
nav ul {
list-style: none;
margin: 0 10px;
padding: 0;
}
nav li {
display: inline-block;
}
nav a {
padding: 15px 10px;
}
/***************************
Footer
****************************/
footer {
text-align: center;
clear: both;
padding-top: 50px;
}
footer p {
/*font-size: 0.35em;*/
}
.social-icon {
width: 20px;
height: 20px;
margin: 0 5px;
}
/***************************
PAGE:Home
****************************/
#brick {
float: left;
/*font-size: 0.650em;*/
text-align: center;
width: 100%;
margin: 0;
font-family: 'Josefin Slab', serif;
}
#chunk {
/*font-size: 0.85em;*/
float: right;
width: 45%;
margin: 30px auto;
box-shadow: 0 0 5px rgba( 0,0,0,1);
}
.tall {
}
/*************************************
PAGE:About
*************************************/
#info {
}
/*************************************
COLOR
*************************************/
body{
background-color: #EBFDDB;
}
nav li a {
color: #3B342A;
}
#brick h1 {
color: #3B342A;
}
nav a:hover {
color: #665843;
}
.selected {
color: #665843;
}
a {
color: #FFFD9E;
}
h1, h2 {
color: #FFFD9E;
}
Ken Alger
Treehouse TeacherEdited for markdown.
Joe Bruno
35,909 PointsTry uncommenting out your desired font sizes and placing a period before your classes (I am assuming they are classes - they could be ids, in which case #).
For instance, change "chunk" above to ".chunk" and uncomment your font size so that it should take effect. Verify that the you have the correct syntax by using the Google Chrome Dev tools inspector to check out your css and what styles are or are not taking effect and what lines in your style sheet are generating the code.
Josh Conner
2,851 PointsThose are ids and the hash tags are there but for some reason it isn't showing in the forum.
Joe Bruno
35,909 PointsAlso, if you are using ems, since "1em is equal to the current font size" (http://www.w3schools.com/cssref/css_units.asp), you need to declare a font size in pixels in your body element.
body {
font-size: 12px;
}
Finally, for testing purposes - do NOT use this as a final solution - if all else fails, try adding the !important declaration to your css just to make sure you have the right selector:
.chunk {
font-size: 12px !important;
}
Josh Conner
2,851 PointsOkay.. I tried it in Safari and I.E. and it works fine there is something wrong with Chrome compatibility
Joe Bruno
35,909 PointsDid you inspect the element with the Chrome Dev tools?
Josh Conner
2,851 PointsYeah the only thing I noticed was even though elements have no font size the normalize.css font size is marked out. Like it is being overridden.
Josh Conner
2,851 PointsApparently I zoomed in on the page and Google Chrome saves the zooms per page... so I deleted the zoom by going to Setting, Content Settings, Zoom Levels. Who knew?? Thank you for your help, I'm sorry.