Eye of Design helps users find information on web design and development along with feature a gallary of works created by Gary R. Hess.

Border

Setting a border may be done in almost all, if not all, css styles. A border may be used to show importance of an object, divide sections within your site and/or be a design aspect of your site.

Border styles

  • none
  • hidden
  • dotted
  • dashed
  • solid
  • double
  • groove
  • ridge
  • inset
  • outset

Border width
The border width may be done in two ways. You may either put thin, medium or thick. Or you may use pixels.

Setting the border
There are several ways to set a border. You may set each style, color and width seperately or you may set it at the same time.

Examples of each
border: 1px dashed #000;
border-color: #000;
border-style: dashed;
border-width: 1px;
border-bottom: 1px dashed #000;
border-bottom-color: #000;
border-bottom-style: dashed;
border-bottom-width: 1px;

To use the border for one side you may change the word "bottom" to either top, left or right.