Tagged: 

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • April 27, 2018 at 9:59 am #947766
    philthebass

    Hi,

    I know that Enfold has the ability to create angled dividers between elements and sections, but can anyone suggest a way to get a wavey edge either along the top or bottom of an element using CSS in Enfold.

    Wavey Edges

    https://screencast.com/t/COyg1nwvduI

    With thanks

    Phil

    • This topic was modified 6 years, 6 months ago by philthebass.
    April 29, 2018 at 5:44 am #948527
    Victoria

    Hey Phil,

    This can actually be done by preparing an image like that and using it in a color section or a slider.

    Best regards,
    Victoria

    May 10, 2018 at 11:51 am #954478
    philthebass

    Hi,

    So I’ve got this working using this CSS

    #waves {
    margin-top: -78px;
    z-index: 12 !important;
    position: relative;
    }

    using a color section with a background image.

    It works OK if the viewport is 1600 or more, but breaks under that – space starts showing beneath the div

    Regards

    Phik

    May 11, 2018 at 12:45 pm #955240
    Ismael

    Hi,

    Thanks for the update. Set the background position to bottom and then adjust the css code.

    #waves {
    margin-top: -100px;
    z-index: 10000 !important;
    position: relative;
    height: 80px !important;
}

    The color section has a minimum height of 100px.

    Best regards,
    Ismael

    May 11, 2018 at 2:04 pm #955295
    philthebass

    Thanks Ismael. That’s working great now.

    https://www.impactmh.org.uk/

    Regards

    May 12, 2018 at 8:21 am #955599
    Victoria

    Hi philthebass,

    Glad we could help :)

    If you need further assistance please let us know.
    Best regards,
    Victoria

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.