CSS: Border

By Xah Lee. Date: . Last updated: .

Example of borders:

solid
dotted
dashed
double
groove
ridge
inset
outset

Border has this shorthand syntax:

border:solid 2px red

border is shorthand for

Sample code:

p {border:solid 2px red}

Border Style

solid is a value from border-style property.

Here's possible border-style values:

Side Borders

Border can be applied to a side only.

The properties are:

Example:

something in the water does not compute
.border21542 {
display: inline-block;
border-bottom: dotted 5px red;
}

Border with Round Corners

solid
dotted
dashed
double
groove
ridge
inset
outset

[see CSS: Round Corners]

JS in Depth
XAH  BUY NOW

CSS

Basics

Color

Font

Text Decoration

Box Model

Box Decoration

Layout

Layers

Transform/Animation

Line Wrap

Misc