Image Borders

Hey there,

I have a question about image borders, I am not sure if this is covered under your support but I thought I would ask.
I would like to have a “swoosh” as a border for divs, I have created the site and made the effect by creating images with the swoosh in photoshop, but, I am wondering if there is a way I can overlay the swoosh without having to photoshop the background images.

I’ve linked an example page as “private content”.

Right now that first image you see was made in photoshop to have the “swoosh” border on the bottom (orange border). I am wondering if there is some way I can code, in CSS, that swoosh image to overlay the background image. So that whenever I change the image I don’t need to go in to photoshop and add the swoosh manually.

I feel like maybe I am not making good sense here so I apologize for that. I essentially want an image overlaid on top of the divs/color sections that should have this swoosh border. Something coded in the back end.

Anyway, sorry if this is unclear. I’d love some help or thoughts/ideas for how to code. Maybe using border-image that stretches across only the bottom border, using a .png file, or ::before/::after?

Thanks so much,

Erika

• This topic was modified 5 years, 5 months ago by design_necca.