HTML and CSS Reference
In-Depth Information
Make sure that the arrows are on a transparent
background. When the
:hover
is active, the user
needs to see the stripped lines behind the arrow,
not the arrow surronded by white background.
Including them into HTML is easy.
Do the same as you did for the social icons: define
your classes and insert them with the general “
ico
”
class along the individual classes.
Wrap your words (
prev and next
) inside a new
span
tag
with the classes defined as “
ico-arr-left”
and as the
“
ico-arr-right”
and add the “
ico
” class.
The HTML:
<p class=”navigation”>
<a href=”#” title=”#” class=”btn”>
<span class=”ico ico-arr-left”>Prev</span>
</a>
<a href=”#” title=”#” class=”btn”>
<span class=”ico ico-arr-right”>Next</span>
</a>
</p>
