Can I make a 'double line' border round an element in webflow

Design help Design inspiration
1

Can I make double line borders of different sizes around an element such as a graphic text box or slider in webflow? I have tried using drop shadow but need the lines to be evenly spaced around. nesting two boxes doesn’t seem to work.

Any Ideas Folks?

2

@ros_garland I think one has suggested to have it double divs. It should work for your case I believe.

3

Check if the CSS property for a double border line fits your needs. Then create a class and add it to the <head> section in your Dashboard embeds.

Class could be like this:

<styles>
.double-border{border-style: double;}
</styles>

Then in Webflow, add your new class to your element.

References for border styles: http://www.w3schools.com/css/css_border.asp

4

Use Use Outer Glow Instead of Shadows:

Example: Select Outer Glow three times

First Outer Glow:

Type Outside
Color Black (or whatever you want)
Angle 90
Distance 0
Blur 0
Size 3 as an example

Second Outer Glow:

Type Outside
Color White
Angle 90
Distance 0
Blur 0
Size 9 as an example

Third Outer Glow:

Type Outside
Color Black
Angle 90
Distance 0
Blur 0
Size 12 as an example

3 Likes