Need help with CSS Tabs & Border Color

I am开发者_开发百科 trying to replicate the effect I see

Currently I have http://jsfiddle.net/GWkk3/

How can I remove the border between the active li and the 2nd level nav?

Draw the border on the parent <li> elements rather than the child <ul>. Add/change these properties:

.appTabs li {
    border-width: 1px 0 1px 1px; /* was 1px 0 0 1px */
}

.appTabs li.active {
    border-bottom: 1px solid #EEE;
}

.appTabs li ul {
    top: 25px; /* was 24px */
}

And remove this property:

.appTabs li ul {
    border-top: 1px solid #CCC;
}

That gets us this far:

Now the inner border just needs to be extended all the way to the right (I'm working on that part).

Make the active tab have 1px extra bottom padding, and have a bottom margin of -1px, so it sits over the line.