Q:

Double colored border in Sencha Touch Tabbar

I have to questions:
I have a Tabbar (docked at bottom) with three items, and i want to have a "separator" between that elements. I tried to emulate the separator using border-right CSS property.
Firts question is: Is there a way to add an specific class (into the sencha class hierarchy) to the last item of my bar and for this element turn off the border-right property?
Also, i want the border composed by two lines, one dark gray color and the other a little light than the first one. The second: How i can setup this using CSS? 
I know how to do that with a complete border but no in that case.
Any help is very appreciated!

A:

First, you can use the :last-child selector to set the border-right to none for the last tab. Second you can use box-shadow to add the second vertical line (the first is the border-right):
HTML:
<ul>
  <li>Tab 1</li>
  <li>Tab 2</li>
  <li>Tab 3</li>
</ul>    

CSS:
ul {
  list-style:none;
  padding:0;
}
ul > li {
  width:33%;
  height:100px;
  float:left;    
  border-right: 1px solid darkgray;
  box-shadow:  1px 0 0 white, 2px 0 0 lightgray;
  text-align:center;
}
ul > li:last-child {
  border-right:none;  
  box-shadow:none;
}

Demo.

