Im trying to create a navigation bar in the following format

left - background - right

the coding is as following

#nav {
width:860px;
position:relative;
background:url(../img/nav_bg.png);
repeat: repeat-x;
}

#nav ul {
width:860px;
text-align:center;
height:34px;
padding:0;
font-size:12px;
margin:0;
}

#nav li {
display:inline;
text-align:center;
padding:0 32px;
background:url(../img/nav_divider.png) center left no-repeat;
font-size:12px;
margin:0;
}

#nav a {
color:#525252;
font-size:12px;
text-decoration:none;
line-height:34px;
}

#nav a:hover {
text-decoration:underline;
}

#nav li.current {
font-weight:700;
color:#525252;
text-decoration:underline;

}

i tried using the following

#nav_left {
background:url(../img/nav_left.png);
width: 7px;
height: 33px;
}

#nav_right {
background:url(../img/nav_right.png);
width: 7px;
height: 33px;
}

but it didnt work so just take the details from that. Can anyone please help me

and what exactly is

eft - background - right

supposed to look like??

I think he wants a menu bar with images on sides and a color background, why not. It's a bit difficult to explain, i know

But what's "#nav_left" and "#nav_right" ? Maybe you try to make two "div" and specify a float for one ?
It's a bit difficult to say ...

Give us an online example. That would help.