HTML and CSS Reference
In-Depth Information
.legend
{
background
:
#f0f0f0
;
border-radius
:
4px
;
bottom
:
0
;
position
:
absolute
;
text-align
:
left
;
width
:
100%
;
}
.legend li
{
display
:
block
;
float
:
left
;
height
:
20px
;
margin
:
0
;
padding
:
10px 30px
;
width
:
120px
;
}
.legend span.icon
{
background-position
:
50% 0
;
border-radius
:
2px
;
display
:
block
;
float
:
left
;
height
:
16px
;
margin
:
2px 10px 0 0
;
width
:
16px
;
}
The x-axis is very similar to the legend. We line up the elements horizontally and anchor them
to the bottom of its container (
.graph
):
/* x-axis */
.x-axis
{
bottom
:
0
;
color
:
#555
;