border-bottom

Browser Internet Explorer Netscape Opera Safari Firefox
Version 5.5 6.0 7.0 8.0 8.0 9.0 7.0 8.0 9.2 9.5 1.3 2.0 3.1 1.5 2.0 3.0
Supported Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes
Short information
CSS CSS1
Default value Depends on arguments used
Inherited No
Applied To all elements
HTML analog <img border > | <table border>
Reference to specification http://www.w3.org/TR/CSS21/box.html#border-shorthand-properties
Description
With the help of this parameter it is possible to install values, such as thickness, a style and border color at the bottom of an element. It is delimited by space in any order, browser will define which of them matches to the needed attribute.

Syntax

border-bottom: border-width || border-style || color
Arguments
Border-width determines border thickness. For border type control you can choose following 8 valuess of parameter border-style

Two first styles: dotted and dashed are supported by the browser Internet Explorer, version 5.5
Argument color determines border color. The value may be in any valid CSS format.

Example

<!--
   .panel {
    background: #ccc; /* Background color */
   }
   .panel P.content {
    padding: 5px; /* Add fields */
    margin: 0; /* Remove indents of paragraph */
    border-top: 2px dotted white; /* Parameters of the top line */
   }
   .panel P.title {
    font-family: sans-serif; /* Sans-serif type */
    font-weight: bold; /* Extra bold */
    font-size: 90%; /* Font size */
    padding: 5px; /* Add fields */
    margin: 0; /* Remove indents of paragraph */
    background: maroon; /* Background color */
    color: white; /* Text color */
    border-bottom: 2px solid white; /* Parameters of the bottom line */
   }
 
-->
<div class="panel">
 
Lorem ipsum dolor sit amet
 
Lorem ipsum dolor sit amet, consectetuer adipiscing elit,
     sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna
     aliguam erat volutpat.</div>
The result of this example is shown on the figure 2.

Object model
[window.]document.getElementById("elementID").style.borderBottom