menu wrap

  • John McCubbin

    #4985

    I was wondering if its possible to split the menu wrap to left and right sides as my menu colour is a gradient but when I put a gradient in the menu wrap it breaks my current menu wrap is #header-menu-wrap {background: #94BDF5;} but I only want this colour for the right of the menu and a darker colour of #header-menu-wrap {background: #0B479D;} is there a way to doo this?

    ronangelo

    #30126

    you don’t have to split the menu-wrap.

    try formulating the gradient you want here: http://www.colorzilla.com/gradient-editor/

    here’s an example:

    #header-menu-wrap {
    background: #38d8d3;
    background: -moz-linear-gradient(left, #38d8d3 0%, #0010a5 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#38d8d3), color-stop(100%,#0010a5));
    background: -webkit-linear-gradient(left, #38d8d3 0%,#0010a5 100%);
    background: -o-linear-gradient(left, #38d8d3 0%,#0010a5 100%);
    background: -ms-linear-gradient(left, #38d8d3 0%,#0010a5 100%);
    background: linear-gradient(to right, #38d8d3 0%,#0010a5 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#38d8d3', endColorstr='#0010a5',GradientType=1 );
    }

    John McCubbin

    #30127

    i have retried doing this and for some reason this time it has worked as I have done this before and it has broken the menu. Hopefully wont need to come back about this

    John McCubbin

    #30128

    No I take that back it has still broken the menu on IE and this is a big problem as need the menu

    John McCubbin

    #30129

    anyone else have any suggestions

    Josh

    #30130
    Quote:
    No I take that back it has still broken the menu on IE and this is a big problem as need the menu

    This doesn’t really tell us anything.

    Instead of saying “it’s broken”… tell is HOW it’s broken. Does it disappear? Does it just not apply the color gradient? Does it knock down your entire site? Specifics save us from having to do the legwork to find them out for ourselves… and will probably facilitate a faster response from other forum members.

    If by “broken”, you mean it’s not applying the color gradient… try adding the !important declaration, like this:

    #header-menu-wrap {
    background: #38d8d3 !important;
    background: -moz-linear-gradient(left, #38d8d3 0%, #0010a5 100%) !important;
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#38d8d3), color-stop(100%,#0010a5)) !important;
    background: -webkit-linear-gradient(left, #38d8d3 0%,#0010a5 100%) !important;
    background: -o-linear-gradient(left, #38d8d3 0%,#0010a5 100%) !important;
    background: -ms-linear-gradient(left, #38d8d3 0%,#0010a5 100%) !important;
    background: linear-gradient(to right, #38d8d3 0%,#0010a5 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#38d8d3', endColorstr='#0010a5',GradientType=1 ) !important;
    }

    John McCubbin

    #30131

    Sorry I should have explained a bit better. The main part of the menu the gradient works fine but when you go to any drop down part it shows that part white. If I use a solid colour it doesn’t do this but as I have a gradient on the rest of the menu one side looks funny that’s why I was wondering if its possible to split the wrap into left and right. I also have !important at the end.

    Josh

    #30132

    Are you on local or do you have a url?

    John McCubbin

    #30133

    it does this on both

    Josh

    #30134

    Can you provide me a url to do some experimenting on, which has this issue?

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

You must be logged in to reply to this topic.

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