Add spacer between menu items?

  • I currently have this:
    Home About Link1 Link2

    How can I get this?:
    Home | About | Link1 | Link2

    Needs to be dynamic, so when I add a new page I automatically get a new ‘ | ‘ (spacer).

Viewing 1 replies (of 1 total)

  • You can format it using CSS and adding an image as the background of the css properties. I have something similar in my template, except it is a little “chat” bubble that shows up next to the link that is current. I could have easily made it appear for all page links via css. Create a small “|” graphic and use that.

    Here is the code for mine:

    #nav ul li.current_page_item a {
	display: block;
	text-decoration: none;
	color: #FF6600;
	line-height: 33px;
	font-size: 16px;
	padding-top: 0;
	padding-right: 10px;
	padding-bottom: 0;
	padding-left: 35px;
	font-weight: bold;
	margin: 0px;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #FF6600;
	background-image: url(images/icon_menu.png);
	background-repeat: no-repeat;
	background-position: 0px 4px;
}

    Hope this helps.

Viewing 1 replies (of 1 total)
  • The topic ‘Add spacer between menu items?’ is closed to new replies.

Tags