Support » Themes and Templates » Messed up my CSS

  • 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!

Viewing 8 replies - 1 through 8 (of 8 total)
  • Tareq

    (@worthingtech)

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

    Tareq

    (@worthingtech)

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

    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!

    Isn’t News Pro my child theme?

    Tareq

    (@worthingtech)

    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.

    Tareq

    (@worthingtech)

    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.

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

    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;
    }

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Messed up my CSS’ is closed to new replies.