-
Book Overview & Buying
-
Table Of Contents
-
Feedback & Rating

Mastering CSS
By :

In this section, we're going to start working on the different CSS positioning properties, as well as their complementary offset properties. First, we'll absolutely position the shark logo and follow that up by using fixed positioning for the entire navigation bar.
We've got our menu in place, but the shark clearly sits on top of the nav. We need it to be aligned horizontally, more or less. We need to fix the shark so it overhangs the nav bar as well. We'll also want the entire nav to remain stuck to the top of the browser window:
So let's go to our CSS and add position: absolute
to the nav figure
selector. Create a new selector underneath the nav
ruleset. We'll call it nav figure
and give it a position
property with the value of absolute
:
/**************** nav ****************/ nav { background-color: #fff; } nav figure{ position: absolute; } nav img { width: 160px; }
Right away, that looks a lot better:
Let's talk about what we've just...