This justified menu example page explores a variety of CSS solutions for displaying a justified menu where the anchors are displayed as blocks without any actual spacing between them.

The javascript solution can also be applied, this will justify the menu and should work in IE7+, Google Chrome, Safari, Firefox, and probably most other browsers as well.

The blog post that this example page accompanies can be found here: Justified Horizontal Menu - CSS & Javascript Solutions.

Table display:

Table display, no whitespace between the list items:

Table display, and white-space: normal on the anchors:

Table display, auto layout:

Table display, auto layout, absolutely positioned sub menus:

Table display, and padding and margins applied to ul and li:

Table display, and padding applied to li:

Flex display:


Justified, no whitespace between the list items:

Table display plus dividers between items: