HTML and CSS Reference
In-Depth Information
Removing the underline…
Let's get rid of that confusing underline and instead add
a nice bottom border like we did in the lounge. To do
that, open your “journal.css” file and make these changes
to the combined
h1, h2
rule:
Add a bord
er on the bot
tom of the <
h1> and
<h2> elemen
ts. You can a
lmost read th
is like
English: “ad
d a thin, dot
ted line with
the
color #888
888 on the b
ottom borde
r”…
h1, h2 {
color: #cc6600;
border-bottom: thin dotted #888888;
text-decoration: underline;
}
And here's how our new “underline” looks—
definitely more stylish and less confusing
than a text decoration underline.
Now we've got borders
under the <h1>
and <h2> element, not
underlines.
N o t
i ce t
h at
b o r
d e rs
e xt
e n d
al l
t h e
wa y
to t
h e e
n d o
f t
h e p
a g e ,
r at
h e r
t h a
n
j u st
u n d
e r t
h e t
e xt
. Wh
y ? Y
o u ' l
l f i n
d
o u t
i n t
h e n
e xt
c h a
p t e r
.