List toggle Border Style display problem handling

1. <Divclass= "Switch"><ul><Li>All<I>123</I>)</Li><Li>Loved<I>10</I>)</Li><Liclass= "Active">Mid-Rating (<I>2</I>)</Li><Li>Bad Reviews (<I>5</I>)</Li><Li>Blueprint<I>5</I>)</Li></ul>

1. . Switch{float: Left;width:858px;Height:32px;/*the height of each Li*/Line-height:32px;Border:1px solid #ccc;/*outer frame set around 1 pixels*/Margin-bottom:100px;}. Switch Li{float: Left;width:100px;text-align:Center;}/*when the label is selected*/. Switch Li.active{Height:30px;/*change the height of Li, plus the top border 3 pixels greater than the height of each Li itself, so you can open the div under the border*/Border-top:3px Solid #8FAB72;Border-left:1px solid #ccc;Border-right:1px solid #ccc;background:#fff;/*Open it up with the background .*/}. Switch Li:first-child.active{Border-left:None;/*the first child element under UL Li*/}

From for notes (Wiz)

List toggle Border Style display problem handling