Positioning Elements in 3D

Once you start using relative and absolute positioning, it’s quite possible to find that your elements have overlapped. You can choose which element should be on top.

To position elements in 3D:

Type z-index: n, where n is a number that indicates the element’s level in the stack of objects.

Figure 11.41. When we floated the navbuttons they slid under the description. It’s not noticeable at first because the description has a transparent background but when you try to click the links, they balk.

Figure 11.42. We set the z-index level to 1 which pulls the navbuttons div above the description. Notice that we must position ...

Get HTML, XHTML, & CSS, Sixth Edition: Visual QuickStart Guide now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.