Forums

[resolved] CSS Changes Not Appearing On Site. (18 posts)

  1. Anonymous
    Unregistered
    Posted 3 years ago #

    Alright, I've got a major problem, guys...I was just finishing up a new theme for my site; Changing the h1 and h2 properties --

    When all of a sudden, the changes stopped appearing on my site.

    I simply edited the font-size attribute on h1 and h2, making it slightly smaller than the '20px' size I had it set at originally...And it stayed 20px. So I changed it even smaller -- Still nothing. Desperate, I switched it to an insane 125px, hoping it was simply my eyes not catching a subtle change -- Still no change on my site.

    - The permissions are fine on the CSS file. [644.]
    - My browser's cache has been cleared repeatedly.
    - A computer restart does nothing.
    - Viewing my site in the other computer in my apartment does nothing.
    - Rebooting my Internet HUB does nothing.
    - Removing the h1 and h2 sections of my CSS file does work, but I do not want the default h1 and h2 properties applied. I want to be able to customise them.

    Obviously.

    Furthermore, the changes I make in single.php -- Switching the h2 to an h4, for example -- Do nothing as well.

    I'm extremely frustrated. Extremely.

    Can anyone provide insight...Please?

  2. Anonymous
    Unregistered
    Posted 3 years ago #

    Gah, anyone ...? I'm totally desperate right now!

    And to add, my CSS is completely valid, and my xHTML is Strict 1.0 -- Also completely valid.

  3. Anonymous
    Unregistered
    Posted 3 years ago #

    And another thing I just noticed on my site ... I have wordpress installed in a password protected directory -- I have to enter said password twice before it will work.

    I figured was just making a type the first time around, but no, I must enter it twice every single time, before it'll let me in.

    Does this added info give anyone insight ...?

  4. Ogre
    Member
    Posted 3 years ago #

    Browsers tend to cache the style sheet. You need to force a reload by holding down a shift key when you click on the refresh button.

  5. Anonymous
    Unregistered
    Posted 3 years ago #

    I think it may be my folder/file permissions ... But this doesn't make any sense, as I make a point to never touch them.

  6. Ogre
    Member
    Posted 3 years ago #

    Ok, after re-reading your first post it's obvious it's not a caching problem. Is it possible you have been editing the wrong theme? View the page code and check the path to the style sheet. Then pull up the style sheet in the browser to verify your changes are in it.

  7. Anonymous
    Unregistered
    Posted 3 years ago #

    I am most definitely editing the correct file. [Checked that ages ago, and even deleted all the other themes to be extra sure.]

    And yeah, totally not a caching problem. Did the whole CTRL + F5 thing a thousand times today.

  8. Ogre
    Member
    Posted 3 years ago #

    If you can actually see the changes in the style sheet when viewed with your browser (not inside of wordpress!!!), then this is very weird. You should be viewing it via the url, e.g. http://thedomain/path/wp-content/themes/my-special-theme/style.css

    Some other possibilities, albeit unlikely, your server is behind a caching proxy or you've overridden the style sheet with a local one.

  9. Anonymous
    Unregistered
    Posted 3 years ago #

    Yeah, the CSS changes are clearly showing up in the textual stylesheet.

    Another thing ... The only change that refuses to appear is the font-size attribute. Color works fine, text-align works fine, padding works fine.

    Hell, font-size even works fine on the body --- Why not in h1 and h2?!

    Ahhhhhh, I'm seriously so code-angry right now!

  10. Ogre
    Member
    Posted 3 years ago #

    Ah! That's very different. Probably there's something else in the style sheet overriding your settings. Use firefox, get the "web developer's toolbar" extension. Activate it. Pull up the page and press Ctrl-Shift-F. Now click on an item you expect the changes to work on and you'll see all kinds of good information on it, e.g. "Font Family" and "Font Size" (under "Other" in the information box). That might help you track down what's buggering your changes.

  11. Anonymous
    Unregistered
    Posted 3 years ago #

    I just went and did this --- The 'Other' information insists the 'Font Size' is set at 20px, when in reality it's set to 40px.

    What the heck!?

  12. Ogre
    Member
    Posted 3 years ago #

    One quick cheat to see if it's an override causing the problems is to move your changes to the very end of the file. This is not the correct way to fix it since it will probably have unintended side effects, but it will at least help you locate the problem.

  13. Anonymous
    Unregistered
    Posted 3 years ago #

    ...move your changes to the very end of the file...

    How do you mean, exactly? I apologise, :(, I'm sure I understand what you mean, but I want to double check.

  14. Ogre
    Member
    Posted 3 years ago #

    Duplicate your style changes at the end of the style sheet document (you are editing style.css, right?).

    Here's another thought. A typo will cause the item to be completely ignored!, e.g.

    h2 {
      font-weight: bold
      font-size: 40px;
    }

    The missing semicolon after bold will muck up everything. I've been bitten by this a few times.

  15. Anonymous
    Unregistered
    Posted 3 years ago #

    Nope, nothing like that, either ... :(

    Wow. Gosh. The only thing that will not show up as edited is the font-size attribute within H2, and H2 only.

    Every single other H[insert any damn number here] font-size change will appear. Just not H2.

    So, I suppose I'll have to work around this mysterious MOTHERF************ problem!!!!!! ARGH.

    I'll just use H2 for the header image, as the only attribute for the header image is padding. And I'll have to use the other H#s for everything else. Hope my plan works, I'm about to delete WordPress off my site in total if it doesn't! >:(

    Because I swear, it must be WordPress --- I have been building sites and editing CSS files for a damn living, and I have NOT ONCE had this problem before. Not even once. >:(

    EDIT: Apologies for any unneeded anger above. I do need to start attending anger management classes again. :P

  16. Anonymous
    Unregistered
    Posted 3 years ago #

    Oh dear lordy lord lord. I think I figured it out.

    I had an H2 attribute, along with a '.post h2' attribute, both in the same CSS file.

    Would this have caused the problem?

  17. Anonymous
    Unregistered
    Posted 3 years ago #

    Yes. Yes, that is what it was.

    Dear god.

    Completely my own coding's fault -- Jeez, I am lame, aren't I? Hours of headaches later, I have figured it out. GAH!

    X__X;

    Thank you so much for trying to help, Ogre. :) :) :)

  18. charissaproctor
    Member
    Posted 3 years ago #

    I have the same issue, out of the blue - changes made to colors of h1 h2 etc do not show up at all?
    Here is my code....any insights would be grand!! Thanks

    /* -----| Globals |------------------------------------------------------ */

    body {
    background-image: url("http://www.proctorsurf.com/images/bg-loader.gif")
    background-color: #161410;
    color: #9C9890;
    font: 80%/125% Verdana, Arial, Helvetica, sans-serif;
    margin: 0;
    padding: 0;
    }

    /* hr { display: none; } */

    hr {
    background-color: #22201d;
    border: 1px solid #363430;
    height: 10px;
    margin: 10px 0;
    width: 850px;
    }

    a:link, a:visited, a:active { color: #6cb335; text-decoration: none; }
    a:hover { color: #cccccc; text-decoration: none; }
    .commentlink {
    color: #363430;
    }
    span {
    color: #363430;
    }

    span:hover {
    color: #cccccc;
    }

    ul { list-style: none; }

    input, textarea {
    color: #9c9890;
    font-size: 11px;
    text-decoration: none;
    background-color: #161410;
    border: 1px solid #363430;
    padding: 5px;
    }

    blockquote {
    background: #1b1814;
    padding: 1px 15px 5px;
    border-bottom: 1px solid #35302a;
    }

    table { width: 100%; border-collapse: collapse; }
    th { border-bottom: 1px solid #35302a; text-align: left; }

    pre {
    padding: 5px 0;
    border-top: 1px dotted #35302a;

    border-bottom: 1px dotted #35302a;
    }

    /* -----| Structure |---------------------------------------------------- */

    #page {
    margin: 20px auto 25px;
    padding: 0;
    width: 850px;
    }

    #header {
    text-align: center;
    }

    #wrapper, #headerimg { width: 850px; }
    #wrapper { background: url('') repeat-y top left;}

    .image {
    background: #22201d url('images/image_left.png');
    border: 0px solid #363430;
    height: 151px;
    width: 425px;
    }

    .bkgleft { background: url('images/image_left.jpg'); float: left; }
    .bkgright { background: url('images/image_right.jpg'); float: right; }

    #footer {
    font-family: Georgia, 'Times New Roman', serif;
    color: #999;
    }

    #content, #sidebar {
    border-left: 1px solid #363430;
    border-right: 1px solid #363430;
    padding: 0 10px;
    word-wrap: break-word;
    }

    #content { float: left; font-size: 1.1em; width: 607px; }
    #content h2 { margin: 0 0 10px; }
    #content p { line-height: 1.5em; }

    #sidebar { border-left: 0; float: right; width: 200px; }
    #sidebar h3 { color: #4E4943; margin: 15px 0 5px; font-variant: small-caps; }
    #sidebar ul { margin: 0 0 10px; padding: 0; border-top: 1px solid #363430; border-bottom: 1px solid #363430; }
    #sidebar li { display: block; padding: 4px 10px; background: #22201d; margin: 1px 0; }
    #sidebar li:hover { background: #363430; }

    #searchform { background: #22201d; padding: 10px; text-align: center; }
    #s { width: 160px; }

    .goleft { float: left; }
    .goright { float: right; }

    ul.navigation {
    border-top: 1px solid #363430;
    border-bottom: 1px solid #363430;
    }

    ul.navigation li { display: block; padding: 4px 10px; background: #22201d; margin: 1px 0; }
    ul.navigation li:hover { background: #363430; }

    /* Post Structure */

    .post { padding: 10px 0 0; }
    .widecolumn .post { padding: 0; margin: 0; }

    .top { padding: 15px 10px 0px; background: #1b1814; margin-bottom: 15px; border-bottom: 1px solid #35302a; }
    .lastfive { padding-left: 10px; padding-right: 10px; }
    .postmetadata { margin: 3px 0; padding: 0; }
    .postmetadata a { font-weight: bold; }
    #sidebar .postmetadata { line-height: 1.5em; }
    .continue { font-weight: bold; font-size: 1.3em; }

    .top .entry { font-size: 1.1em; }
    .entrytext { padding: 0 10px 0; line-height: 2em; font-size: 1.1em; }

    .entrytext h2 { border-bottom: 1px solid #4E4943; display: block; }
    .entrytext ul { list-style-type: square; }

    /* Comments Structure */

    .comments { padding: 10px; margin-top: 15px; background: #1b1814; border-top: 1px solid #35302a; position: relative; }
    #commentform p { float: left; margin: 0 10px 10px 0; }

    .commentlist { background: #1b1814; list-style: none; margin: 0; padding: 0; }
    .commentlist li { background: #161410; margin-top: 10px; padding: 5px 0 0; }
    .commentlist li p { padding: 5px 10px 0; margin: 0; }
    .commentlist li p.commentmetadata { border-bottom: 1px solid #35302a; background: #181612; padding: 5px 10px; margin-top: 10px; }

    ul.archive { list-style: none; padding: 0; margin: 0 10px 25px; font-size: 1.3em; }
    ul.archive li { display: inline; }

    /* -----| Typography |--------------------------------------------------- */

    h1, h2, h3, h4, h5, h6 { font-family: Georgia, 'Times New Roman', serif; font-weight: normal; }

    h1 { color: #fff; font-size: 2em; line-height:1em; margin: 0 0 8px; }
    h1:before, h1:after { content: " . . "; color: #444; }
    h1 span { color: #B9C9E8; }

    h1.title { color: #a1d1f1; font-size: 2em; line-height:1em; margin: 0 0 8px; }

    h2 { color: #a1d1f1; font-size: 1.25em; margin: 0; padding: 1px 0; display: inline; border-bottom: 1px solid #35302a; }
    .post h2 a { color: #a1d1f1; }
    .post h2.first { font-size: 1.75em; }

    .widecolumn h2.title {
    display: block;
    padding: 13px 10px;
    background: #1b1814;
    margin: 0 0 15px;
    border-bottom: 1px solid #35302a;
    font-size: 1.75em; }

    h3 { color: #9C9890; font-size: 1.25em; margin: 0; padding: 1px 0; display: inline; border-bottom: 1px solid #35302a; }
    .post h2 a { color: #9C9890; }
    .post h2.first { font-size: 1.75em; }

    .description { color: #666; font-weight: bold; }

    .comments h3 { margin: 0 0 10px 0; color: #BEB798; }

    /* -----| Miscellaneous |------------------------------------------------ */

    .clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }

Topic Closed

This topic has been closed to new replies.

About this Topic