Background-color top-menu doesn't change

  • mathijs55

    #5866

    Hi guys,

    First of all i would like to thank the maker of this awesome theme! You are really doing an epic job 🙂

    I’m building a website for somebody and i encountered a (small) problem and i hope you guys can solve it for me. I tried several things but it didn’t work.

    In IE (8) the background color of my top menu doesn’t seem to change. In Chrome/Firefox etc i have a small gradient but the overall color is grey (#ddd).

    Can somebody help me fix this?

    Also i would like to make the text in the slider a bit smaller, where can i edit this?

    Thanks!

    *Edit: My website is http://www.thebeautyroom.nl

    Mod

    Kenneth John Odle

    #32803

    Second issue:

    Add this to custom CSS:

    .slider_post_entry p {
    font-size: 90%;
    }

    Adjust the font size to whatever you would like.

    First issue:

    What values are you using in Graphene’s “Colours” options?

    Quote:
    In IE (8) the background color of my top menu doesn’t seem to change.

    IE is a constant problem.

    mathijs55

    #32804

    Thanks for the custom css. The text is now quite a bit smaller.

    Is there also a way to make the black area smaller?

    For my primairy menu i have the following settings

    Top background: #ddd

    Bottom background: #ddd

    If it’s fixable without the use of a gradient i’m happy too, because i think that is causing the problem right?

    I know IE is a huge pain in the ass, i only noticed the flaw yesterday because i always work in Chrome or Firefox.

    Thanks in advance.

    Mod

    Kenneth John Odle

    #32805

    #ddd returns a grey value. Since you are specifying the same grey value for both the top and bottom of the gradient, you are seeing a solid grey band, instead of a gradient.

    Selecting different default background colors will produce the gradient you are looking for. It should work in IE8, “should” being the operative word in all Microsoft products:

    ztIWw.png

    Mod

    Kenneth John Odle

    #32806
    Quote:
    Is there also a way to make the black area smaller?

    Really, the best way to do that is to decrease your excerpt length (or use a smaller font), as the size of the black area is determined by the size of the excerpt.

    However, you can add something like this to custom CSS and start playing around with values:

    .slider-entry-wrap {
    margin: 0;
    position: absolute;
    width: 100%;
    z-index: 10;
    }

    For example, doing something like this:

    .slider-entry-wrap {
    margin: 0;
    position: absolute;
    width: 50%;
    height:35%;
    z-index: 10;
    }

    produces this:

    jkUIc.png

    mathijs55

    #32807
    Quote:
    #ddd returns a grey value. Since you are specifying the same grey value for both the top and bottom of the gradient, you are seeing a solid grey band, instead of a gradient.

    Selecting different default background colors will produce the gradient you are looking for. It should work in IE8, “should” being the operative word in all Microsoft products:

    The problem is is that i already have set these things the way you proposed it to do.

    Check:

    9uW7W.png

    Thanks for the custom css. Works like a charm 🙂

    Mod

    Kenneth John Odle

    #32808
    Quote:
    i already have set these things the way you proposed it to do

    Do you mean that you are choosing something other than #ddd?

    mathijs55

    #32809

    It’s now like this:

    bpU8h.png

    But it doesn’t change on the site itself.

    I really appreciate your help!

    Mod

    Kenneth John Odle

    #32810
    Quote:
    But it doesn’t change on the site itself.

    That’s what I was wondering.

    It appears that someone has edited the default Graphene stylesheet. You have this in your stylesheet:

    /* Top level header menu, default state */
    #header-menu-wrap {
    background:#ddd!important;
    position: relative;
    }

    on line 602. It should read

    #header-menu-wrap {
    background: url(images/sprite_h.png) left -4px repeat-x #101010;
    position: relative;
    }

    That !important declaration is what is preventing your changes from being applied.

    mathijs55

    #32811

    Ok i edited it and it now changes in Firefox and Chrome. However the color remains darkblue in Internet Explorer.

Viewing 10 posts - 1 through 10 (of 17 total)

You must be logged in to reply to this topic.

Do NOT follow this link or you will be banned from the site!