Can't modify body with css?

Question

I am completely stumped. I am trying to add a background to my page and set the text. I am trying to do both to my body. For some reason, this has no effect:

body
{
    padding-top: 80px;
    background-image: url(../img/WorldGrainyBlurred.png);
    background-position: -80px;
    font-size: 100%;
    font-family: "HelveticaNeue-CondensedBold", "Helvetica Neue";
}

To see if it was applied at all, I tried making the page red and making the padding huge but it never applied. I can see that the css is being applied, but this statement seems to be having no effect. Any ideas?

EDIT: JSFiddle http://jsfiddle.net/5ytdP/

What can you see through web inspector? Also, try height: 100%; — Mihey Egoroff, Feb 11 '14 at 19:20
@MiheyEgoroff Nothing - that's the thing that's driving me crazy. It doesn't seem to be applying at all. — AttilaTheFun, Feb 11 '14 at 19:21
@Danko, yeah. If I try to set the font-family in a div, it works fine. It's just if I try to target the body like this. Is there some trick to get the css to target your entire body? — AttilaTheFun, Feb 11 '14 at 19:24
I'll see if I can make an example that still has the same issue. — AttilaTheFun, Feb 11 '14 at 19:28
If just the `font-family` isn't working, try this: http://stackoverflow.com/questions/7025756/how-to-apply-global-font-to-whole-html-document At least on my system, all of the other rules apply properly. — cf-, Feb 11 '14 at 19:28
@computerfreaker, it's not the font family. That works fine if I apply it outside the body. It's that my body css isn't applying. — AttilaTheFun, Feb 11 '14 at 19:36
Looking at your jsFiddle I see it being applied just fine, except for the background image of course. — Xavier_Ex, Feb 11 '14 at 19:39
Are you actually linking the stylesheet in the page's head? It does look okay in the jsFiddle, and as I mentioned the rules apply correctly in a simple test page on my system. — cf-, Feb 11 '14 at 19:43
there are a few html tag errors that could be messing things up... for instance line 5 an unclosed `
` and line 18 there is an unclosed ``. — 80PoundsOfFury, Feb 11 '14 at 19:44

score 1 · Accepted Answer · answered Feb 11 '14 at 19:43

You need to take these random CSS lines out that are right before the body {...}:

-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;

jsFiddle

The padding now is rendered properly. The background image doesn't show because it has relative path that is not on jsfiddle.net, but the browser is looking for it now. Maybe those lines need to go inside the body rule? I am not familiar with them, but I haven't seen CSS outside of a rule block before.

Can't modify body with css?

1 Answers1