WordPress.org

Forums

Messed up my CSS (9 posts)

  1. experimentalme
    Member
    Posted 1 year ago #

    Help! I tried to change the background color of my menu but instead I somehow managed to change the menu's text color to white when you hover over it or click on that page! I went back to CSS and changed all that white to black - but it's still not working. Please help...

    I am using the News Pro theme.

    my website is grandinettelaw.com.

    I also tried resetting the default CSS based on the tips I came upon for others who screwed up like I did - but that didn't seem to work...

    Thanks!

  2. Tareq
    Member
    Posted 1 year ago #

    If you have reset to your default CSS and it doesn't work, have you cleared your browser cache?

  3. Tareq
    Member
    Posted 1 year ago #

    Oh and before you make any further customisations, create a Child Theme by following this link -> Child_Themes

  4. experimentalme
    Member
    Posted 1 year ago #

    I did clear my browser cache (and I checked the updates on my ipad just in case). I don't think I reset my default css properly though (I'm new to this as of last night). How do I do it properly (without losing the data I already put into the site)?

    Thanks!

  5. experimentalme
    Member
    Posted 1 year ago #

    Isn't News Pro my child theme?

  6. Tareq
    Member
    Posted 1 year ago #

    OK no worries. Follow this:

    Appearance -> Themes -> (select your theme) -> Deactivate Theme -> Delete Theme

    Re-install your theme.

    You will not lose any content, this simply deletes the theme from your site and then allows you to start from scratch.

    It is strongly advised that you create a Child Theme (basically a copy of your current theme that you can edit. Find more info here: Child_Themes.

    Alternatively, you may wish to get a Custom CSS Plugin from the plugin repository and use this as opposed to editing your style.css directly.

  7. Tareq
    Member
    Posted 1 year ago #

    P.S. I don't know if News Pro is your child theme, if the theme folder is appended with '-child' then it probably is.

  8. experimentalme
    Member
    Posted 1 year ago #

    Wait when you say start from scratch - what exactly do you mean?

  9. experimentalme
    Member
    Posted 1 year ago #

    This is what it looks like - where do I go from here?:

    ---------------------------------------------------------------------------------------------------- */

    .genesis-nav-menu {
    clear: both;
    color: #000;
    font-size: 12px;
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 1.5;
    width: 100%;
    }

    .genesis-nav-menu .menu-item {
    display: inline-block;
    text-align: left;
    margin-center: -4px;
    }

    .genesis-nav-menu a {
    border-right: 1px solid #e3e3e3;
    color: #000;
    display: block;
    padding: 20px 24px;
    padding: 2rem 2.4rem;
    position: relative;
    }

    .genesis-nav-menu a:hover,
    .genesis-nav-menu .current-menu-item > a {
    background-color: #fff;
    color: #000;
    }

    .genesis-nav-menu > .menu-item > a {
    text-transform: uppercase;
    }

    .genesis-nav-menu .sub-menu {
    border-top: 1px solid #e3e3e3;
    left: -9999px;
    opacity: 0;
    position: absolute;
    -webkit-transition: opacity .4s ease-in-out;
    -moz-transition: opacity .4s ease-in-out;
    -ms-transition: opacity .4s ease-in-out;
    -o-transition: opacity .4s ease-in-out;
    transition: opacity .4s ease-in-out;
    width: 200px;
    z-index: 99;
    }

    .genesis-nav-menu .sub-menu a {
    background-color: #fff;
    border: 1px solid #e3e3e3;
    border-top: none;
    padding: 12px 24px;
    padding: 1.2rem 2.4rem;
    position: relative;
    width: 200px;
    }

    .genesis-nav-menu .sub-menu a:hover,
    .genesis-nav-menu .sub-menu .current-menu-item > a {
    background-color: #000;
    color: #000;
    }

    .genesis-nav-menu .sub-menu .sub-menu {
    margin: -44px 0 0 199px;
    }

    .genesis-nav-menu .menu-item:hover {
    position: static;
    }

    .genesis-nav-menu .menu-item:hover > .sub-menu {
    left: auto;
    opacity: 1;
    }

    .genesis-nav-menu > .right {
    display: inline-block;
    float: right;
    list-style-type: none;
    padding: 0;
    text-transform: uppercase;
    }

    .genesis-nav-menu > .date,
    .genesis-nav-menu > .right > a {
    border: none;
    border-left: 1px solid #e3e3e3;
    display: inline-block;
    padding: 20px 24px;
    padding: 2rem 2.4rem;
    }

    .genesis-nav-menu > .search {
    padding: 10px;
    padding: 1rem;
    }

    .genesis-nav-menu .search input[type="search"] {
    font-size: 13px;
    font-size: 1.3rem;
    padding: 10px 16px;
    padding: 1rem 1.6rem;
    }

Topic Closed

This topic has been closed to new replies.

About this Topic