Gradient in header-builder bar vs. container

[ULinn]

Hi there,
I added a gradient (colour to transparent) in the header-builder to the main bar with an element-css. The conatiners in this bar have a 100% transparent background in the header builder.

But in the containers, the background “doubles”, there is the bar-background, and again the same background in the containers, so the colour is more intense in the containers than outside.

I can fix this by setting “background: none;” in the “x-bar-content” class via the dev-tools, but I don’t see, where I can edit the x-bar-content. If I edit the bar, it seems to affect “x-bar”, if I edit the container, it seems to affect “x-bar-container” …

Any hint, how I can solve this?

Best regards

Uli

[christian]

Hey Uli,

You most probably just used $el. That’s fine for some elements but for structural elements, you will need to target specific areas like if you want to target x-bar specifically, you’d use $el .x-bar.

Hope that helps.

[ULinn]

Hi Christian,

thank you for your help. using $el .x-bar makes the background dissapear completely, probably because the element-id and the x-bar class are in the same element.

But adding the background-css .x-bar in the general header .css works perfect!

Best regards

Uli

[christian]

Hey Uli,

I’m sorry there should be no space between the selectors. It should be $el.x-bar

Hope that helps.