Creating Borders with CSS Stylesheets

Borders can be used within your content for many reasons, highlighting text areas, images or even seperating two table cells from each other. the available properties are listed below visually and some workable examples are further down the page.


border-style Properties:

none: Defines no border

dotted: Defines a dotted border

dashed: Defines a dashed border

solid: Defines a solid border

double: Defines two borders. The width of the two borders are the same as the border-width value

groove: Defines a 3D grooved border. The effect depends on the border-color value

ridge: Defines a 3D ridged border. The effect depends on the border-color value

inset: Defines a 3D inset border. The effect depends on the border-color value

outset: Defines a 3D outset border. The effect depends on the border-color value


Border Style Examples

Please copy and past the codes from the relevant box, edit the areas required, i.e. colors, styles etc and paste them into your stylesheet. Then they will be available from your style drop down selector in the CMS Editor.