Dreamweaver CS3: The Missing Manual
A.4. Padding, Borders, and Margins
The following properties control the space around an element, and let you add border lines to a style. A.4.1. border
Draws a line around the four edges of an element.
A.4.2. border-top, border-right, border-bottom, border-left
Adds a border to a single edge. For example, border-top adds a border to the top of the element.
A.4.3. border-color
Defines the color used for all four borders.
A.4.4. border-top-color, border-right-color, border-bottom-color, border-left-color
Functions just like the border-color property but sets color for only one edge. Use these properties to override the color set by the border property. In this way, you can customize the color for an individual edge while using a more generic border style to define the basic size and style of all four edges.
A.4.5. border-style
Defines the style used for all four borders.
A.4.6. border-top-style, border-right-style, border-bottom-style, border-left-style
Functions just like the border-style property, but applies only to one edge.
A.4.7. border-width
Defines the width or thickness of the line used to draw all four borders.
A.4.8. border-top-width, border-right-width, border-bottom-width, border-left-width
Functions just like the border-width property but applies only to one edge.
A.4.9. outline
This property is a shorthand way to combine outline-color, outline-style , and out-line-width (listed next ). An outline works just like a border, except the outline takes up no space (that is, it doesn't add to the width or height of an element), and it applies to all four edges. It's intended more as a way of highlighting something on a page than as a design detail. Outline works in Firefox, Safari, and Opera, but not in Internet Explorer.
A.4.10. outline-color
Specifies the color for an outline (see outline above).
A.4.11. outline-style
Specifies the type of line for the outline dotted, solid, dashed, and so on.
A.4.12. outline-width
Specifies the thickness of the outline. Works just like border-width (Section A.1.1).
A.4.13. padding
Sets the amount of space between the content and border and edge of the background. Use it to add empty space around text, images, or other content. (See Figure 7-1 in Section 7.2 for an illustration.)
A.4.14. padding-top
Works just like the padding property, but sets padding for top edge only.
A.4.15. padding-right
Works just like the padding property, but sets padding for right edge only.
A.4.16. padding-bottom
Works just like the padding property, but sets padding for bottom edge only.
A.4.17. padding-left
Works just like the padding property, but sets padding for left edge only.
A.4.18. margin
Sets the amount of space between an element's border and the margin of other elements (see Figure 7-1 in Section 7.2). It lets you add white space between two elementsbetween one picture and another picture, or between a sidebar and the main content area of a page. Note: Vertical margins between elements can collapse . That is, browsers use only the top or bottom margin and ignore the other, creating a smaller gap than expected (see Section 7.2.2).
A.4.19. margin-top
Works just like the margin property, but sets margin for top edge only.
A.4.20. margin-right
Works just like the margin property, but sets margin for right edge only.
A.4.21. margin-bottom
Works just like the margin property, but sets margin for bottom edge only.
A.4.22. margin-left
Works just like the margin property, but sets margin for left edge only.
|