CSS Styling A Mess After Changes

  • If someone can shed some light on this I certainly would appreciate it.

    I have a site on a WAMP localhost install on my laptop running WordPress 4.9.7 using a twenty twelve child theme.

    I altered the theme structure dramatically, adding widgets, increasing width, etc.: lots of stuff, and my site was simply beautiful last night. I had it just like I wanted it. I only worked the structure: no added pages, no nothing; just structural things.

    However, I made changes to the style sheet just after that without checking the site to see if everything was okay, and come to find out, everything was not okay.

    When I opened it this morning, the beautiful structure I had was a total disaster! My header image was gone; masthead area just a blank line across the screen; footer with widgets gone; nothing floating, my two sidebars under each other on the right, content area way to left—just a structural mess all over the place.

    I checked the changes, and nothing I tried fixed it. Every time I would try something else, it looked exactly the same. I switched to the twenty twelve theme and everything looked like it should, so I suppose the database is okay. All my added widgets show in the Appearance area. I changed nothing in functions.php, page.php, footer.php. Only the style sheet changed.

    What could I have possibly done to cause a disaster of such magnitude? Could a tiny code glitch in the style sheet do such a thing? Could a typo do this? Everything was fine, and I changed nothing but the style sheet.

    I’m at a loss. Any help is greatly appreciated.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    I’ve totally destroyed CSS by accidentally deleting a } or messing up the pairing of { and } around a media query. Check your pairings of brackets. Also, look for a place where there may be a comment that’s unclosed. Good luck.

    Thread Starter adhdcelt

    (@adhdcelt)

    Thank you, Steve.
    I used an online comparison site to compare changes between the original twenty twelve theme css and the child. What an awesome thing. However, man, what a chore!

    Fortunately everything was okay, and I finally found the problem:
    Empty floating widget areas don’t float and don’t show up in the layout.

    GWRRRRRRRRRR.

    I had removed the widgets from some of the widget areas—all four in the footer, two in the sidebars, and another one. Results? The layout went straight to H.

    I had no idea that empty widget areas don’t float and don’t show, even when styled with CSS.

    Can you, or anyone else, tell me why widget areas are like that?

    Thanks so much for your most gracious input.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘CSS Styling A Mess After Changes’ is closed to new replies.