These properties provide a powerful level of control over the two-and three-dimensional
appearance of tags in the document. Instead of building tables to arrange your
page, you can put each tag exactly where you want it.
|
Property
|
Description
|
Values
|
Example
|
|
clear
|
Specifies if a tag allows floating tags to its
sides
|
none
left
right
both
|
{ clear:left; }
|
|
clip
|
Specifies which part of a tag is visible
|
shape
auto
|
{ clip:rect(0px 200px 200px 0px); }
|
|
float
|
Lets you wrap text around any tag
|
none
left
right
|
{ float:none; }
|
|
direction
|
Sets the direction of a tag
|
ltr
rtl
|
{direction: ltr}
|
|
display
|
The category of a tag
|
None
compact
block
inline
list-item
marker
run-in
table
table-inline
table-column
table-columngroup
table-row
table-rowgroup
table-cell
table-caption
table-header-group
table-footer-group
|
{ display:none; }
|
|
height
width
|
Sets the height and width of a tag
|
length
auto
|
{ height:200px; }
{ width:80%; }
|
|
max-height
min-height
|
Sets the minimum and maximum height of a tag
|
length
auto
|
{ max-height:200px; }
{ min-height:80%; }
|
|
max-width
min-width
|
Sets the minimum and maximum width of a tag
|
length
auto
|
{ max-width:200px; }
{ min-width:80%; }
|
|
overflow
|
Specifies behaviour on overflow
|
visible
hidden
scroll
auto
|
{ overflow:scroll; }
|
|
position
|
Specifies how you can position a tag
|
absolute
relative
static
|
{ position:absolute; }
|
|
top
bottom
left
right
|
Sets the top, bottom, left and right position
of tag
|
length
percentage
auto
|
{ top:0px; }
|
|
visibility
|
Controls visibility
|
visible
hidden
inherit
|
{ visibility:visible; }
|
|
z-index
|
Layering control
|
auto
integer
|
{ z-index:-1; }
|
