HTML and CSS Reference
In-Depth Information
<
li
class
="
main-nav-item
">
<
a
href
="
#
"
class
="
main-nav-tab
">
Tab 4
</
a
>
</
li
>
<
li
class
="
main-nav-item
">
<
a
href
="
#
"
class
="
main-nav-tab
">
Tab 5
</
a
>
</
li
>
</
ul
>
Next, let's style these five tabs:
#main-nav
{
width
:
800px
;
height
:
50px
;
position
:
relative
;
list-style
:
none
;
padding
:
0
;
}
#main-nav .main-nav-item
{
display
:
inline
;
}
#main-nav .main-nav-tab
{
float
:
left
;
width
:
140px
;
height
:
30px
;
padding
:
10px
;
line-height
:
30px
;
text-align
:
center
;
color
:
#FFF
;
text-decoration
:
none
;
font-size
:
18px
;
}
Although a lot of the CSS is specific to our example, there are a few important styles to note.
