Using border-radius for dropdown menu in corporate theme

Can you provide a link to your site? It would make it much easier to help you with your question.

this is site i’m working on bcofjc.org

Check under media.

You are applying the border-radius to

#nav li li a, #nav li li a:link, #nav li li

Instead, you have to apply it to the ul element. Specifically, in your CSS that would be this declaration:

#nav li ul {
z-index: 9999;
position: absolute;
left: -999em;
height: auto;
width: 180px;
margin: 0 0 0 0px;
padding: 0;
}

I add border radius to the above declaration but no change.

Is there a specific line it must be in. Meaning above margin or below or anywhere else in the declaration.

You are applying a background color to the submenu li element, and not declaring a background color to the #nav li ul element.

If you correct that, you will see your border-radius

I get the border radius but it is coming on each item list in the drop down menu. I just want it on the bottom left & right of last item in the list.

Bring it all together like this:

#nav li li a, #nav li li a:link, #nav li li a:visited {
color: #FFF;
display: block;
width: 158px;
font-size: 12px;
margin: 0;
padding: 5px 10px 5px 10px;
border-bottom: 1px solid #ef8300;
position: relative;
}

AND

#nav li ul {
z-index: 9999;
position: absolute;
left: -999em;
height: auto;
width: 180px;
margin: 0 0 0 0px;
padding: 0;
background: #ef8300;
border-radius-bottomright: 4px;
-moz-border-radius-bottomright: 4px;
-webkit-border-radius-bottomright: 4px;
border-radius-bottomleft: 4px;
-moz-border-radius-bottomleft: 4px;
-webkit-border-radius-bottomleft: 4px;
}

Still not getting my desired result.

I finally got it.

#nav li li a, #nav li li a:link, #nav li li a:visited {
background: #0b55a1;
color: #fff;
display: block;
width: 158px;
font-size: 12px;
margin: 0;
padding: 7px 14px 7px 14px;
border-top: 1px solid #0b55a1;
border-left: 1px solid #0b55a1;
border-right: 1px solid #0b55a1;
border-bottom: 4px solid #0b55a1;
position: relative;
}

#nav li ul {
z-index: 9999;
position: absolute;
display: block;
left: -999em;
height: auto;
width: 180px;
margin: 0 0 0 0px;
padding: 0px;
border-right: 1px solid #0b55a1;
border-top: 1px solid #0b55a1;
border-bottom: 4px solid #0b55a1;
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px;
overflow: hidden;
-webkit-box-shadow:rgba(0, 0, 0, 0.298039) 0 0 6px;
}