Full width colored separator with fixed height

Hey marcusss,

You can do that with a Color Section element for example. You can set your preferred height in the element options. You will need to add a class to it in the Advanced tab if you want your divider to be less than 100 pixels. You can name your class color-section-divider for example, then add this to Quick CSS:

.color-section-divider .content {
    padding-top: 0;
    padding-bottom: 0;
}

Best regards,
Rikard

Hi,
Thanks for the link to your site, the element options are for a minimum height, but you actually want to define the maximum height of 10px, the tricky part of this is that the theme sets a minimum height of 100px via javascript.
One way around this with css is this:

#top #main .color-section-divider {
	background-color: transparent;
}
.responsive #top #main .color-section-divider > .container {
	background-color: red;
	max-width: 100% !important;
	width: 100%;
}

Another way is this css:

#top #main .color-section-divider {
clip-path: inset(0 0 90% 0);
}

Best regards,
Mike

Hi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

Best regards,
Mike