1

[John McCubbin]

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]

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]

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]

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]

John McCubbin

#30129

anyone else have any suggestions

[Anonymous]

Anonymous

#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]

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.

[Anonymous]

Anonymous

#30132

Are you on local or do you have a url?

[John McCubbin]

John McCubbin

#30133

it does this on both

[Anonymous]

Anonymous

#30134

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