HTML and CSS Reference
In-Depth Information
float: right;
3.
Save styles.css.
By floating the logo to the left and navigation to the right, as shown in Figure 8-7, you make better use of the hori-
zontal space available. At the moment, the navigation still looks a little messy, but in Chapter 9, you learn about
display
properties to better align those navigation links.
Figure 8-7
The logo and navigation links now float side by side.
Code Challenge: Make the Footer Elements Float Side by Side
In styles.css, do the following:
1.
Add a new rule set for
#footer li:nth-child(1)
with the declaration
float: left;
.
2.
Add a new rule set for
#footer li:nth-child(2)
with the declaration
float: right;
.
3.
Add the declaration
float: right;
to the
blockquote cite
rule set.