My CSS is not being read

  • I am so confused! This site has a footer that is being successfully called, but the CSS doesn’t show up for it. Each element in the footer should be floating left, there should be a background color, etc. But NONE of it’s there! So confusing. I mean, it’s there in the stylesheet, but it doesn’t show up in the browser when I look at the site live. Any thoughts on this predicament?

    I tried changing the template, using !important, and other ideas. To no avail. Alas, my poor footer is left muddled and terrible looking. This site is built on the Genesis framework, if that helps. Thank you SO MUCH in advance for any help you’ve got.

    Cheers!
    Cris

Viewing 14 replies - 16 through 29 (of 29 total)
  • Thread Starter criskelly

    (@criskelly)

    Hmmm. Nothing different, sorry. I notice that in the Google Inspector, when I hover over the HTML line for div#footer, it highlights almost the entire page. How is that possible?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Make sure your website uses valid markup via W3C’s Validator.

    Thread Starter criskelly

    (@criskelly)

    Hmmm…I don’t know what this means:

    Parse Error .content-sidebar #content, .sidebar-content #content { width: 620px; }

    The Validator caught it as an error.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Is that the entirety of the error?

    Here’s a list of explanations for errors
    https://validator.w3.org/docs/errors.html

    Thread Starter criskelly

    (@criskelly)

    Thanks, I’ll check that link. Here’s the whole line:

    658 #content Parse Error .content-sidebar #content, .sidebar-content #content { width: 620px; }

    There are tons of other errors, but ALL are related to -moz, -ms, -webkit, and -o prefixes. Except the last one:

    1933 .entry-content Value Error : margin-top Unknown dimension 30px3

    But I can’t imagine that’s causing the footer CSS to not be read?

    Thread Starter criskelly

    (@criskelly)

    OK, I fixed that last error.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    If you’re still experiencing this problem, could you Pastebin the entire HTML for that web page, rather than just the footer?

    Thread Starter criskelly

    (@criskelly)

    Sure.

    Thread Starter criskelly

    (@criskelly)

    Here’s the new paste:

    https://pastebin.com/sfEf178k

    That’s everything from “view source”.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    If you add;

    #footer {
 clear: both;
}

    Do you still experience the footer highlighting almost the entire page, when using Google Inspector?

    If not, try;

    #footer {
 border: 10px solid red;
}

    To see if any change is applying properly.

    Thread Starter criskelly

    (@criskelly)

    Whoa! I added the border code to the stylesheet, waaaaaay high up on the sheet, and it definitely worked!

    Thread Starter criskelly

    (@criskelly)

    OK, so wow…thanks for leading me down this road. I have the footer working again, but I had to put it way up at the top of the stylesheet. So now all that’s not really working is the code in the bottom: mainly, the media queries.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    As we’ve discussed a while on one issue, you may need to create a new thread for your Media Queries issue, as you’re more likely to receive help.

    Thread Starter criskelly

    (@criskelly)

    Good point. Thanks so much for your help!

    Cheers!
    ck

Viewing 14 replies - 16 through 29 (of 29 total)
  • The topic ‘My CSS is not being read’ is closed to new replies.