The border property can be used to visually define a page element’s outer edge.

In CSS, the border property’s value requires three parts:

  1. thickness: Sets the thickness of the border, using pixels, ems, or rems.

  2. type: Sets the border type. Common options are solid, dotted, and dashed. There are many others.

  3. color: Sets the border’s color, using named colors, HEX, or RGB values.

The CSS below gives a paragraph element a solid black border that is 2 pixels thick:

p { border: 2px solid black; }



The web browser currently displays Tundra Gallery’s homepage. Let’s give each gallery item a border.

In main.css locate the .gallery-item class selector. Add border: 5px solid #FFF;, like so:

.gallery-item { border: 5px solid #FFF; }

Run your code to see borders around each figure with the class gallery-item in the web browser.

Take this course for free

Mini Info Outline Icon
By signing up for Codecademy, you agree to Codecademy's Terms of Service & Privacy Policy.
Already have an account?