Displaying links horizontally


show more Displaying links horizontally provides you with in-depth training on Developer. Taught by James Williamson as part of the CSS: Styling Navigation show less
please wait ...

Displaying links horizontally

In this exercise, we are going to focus on displaying our links horizontally. Now since there are multiple ways to build a horizontal menu, I am going to demo a couple of techniques that allow us to do that, talk about some of the issues surrounding them, and then discuss what my preferred technique is. To do that, I'm working on the horizontal.htm file, this time from the 04_02 directory, but we're just sort of picking up right where we left off. Again, first order of business is to get those links displaying horizontally rather than vertically, which is the default.

Now the key to this is the list item element itself, list items by default are displayed in browsers as block-level elements. Now what that means is that these elements are stacked one on top of another which is why they're displayed vertically. In order to get them to display horizontally we need to sort of change that someway. So the first technique I am going to show you guys is to change the display property. So just be...

Displaying links horizontally
Video duration: 6m 14s 5h 14m Beginner

Viewers:

Displaying links horizontally provides you with in-depth training on Developer. Taught by James Williamson as part of the CSS: Styling Navigation

Subjects:
Developer Web
Software:
CSS
Author:
please wait ...