O'Reilly logo

Eric Meyer on CSS: Mastering the Language of Web Design by Eric A. Meyer

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Styling the Document with Positioning

Floating the sidebar to the right was pretty easy, and for this kind of layout it’s often the best choice. It should be noted, however, that it also depends on the order of the content. If the links had been placed at the bottom of the page after the entry, we couldn’t have floated them as we did in the previous section.

In such circumstances, positioning is a better option than floating, so let’s remove the div#sidebar rule from the style sheet and use positioning to reproduce the look we had in the previous section.

From Floating to Positioning

Having taken out the rule that floats the sidebar, we end up with the sidebar wedged between the h1 and the entry, as shown in Figure 9.8.

Figure 9.8. The unfloated ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required