LJ Navstip Customizations

[sireesanwar.livejournal.com]

Account Status: Free
Actions: Customizing the LJ Navstip
Theme: Flexible Squares (not sure if it works with other themes)

The idea behind this tutorial is to change the look of the LJ Navstip at the top which looks something like this...

Here is the coding I've pieced together.
/*-----------Navstip-----------*/ .w-cs DIV { background: none repeat scroll 0 0 transparent; float: none; } .w-cs .w-cs-userinfo { background: none repeat scroll 0 0 #23CCBC; border-right: 1px solid #3A4449; float: left; height: 50px; min-width: 405px; width: 40%; } .w-cs { color: #000000; font: 10px/10px 'Arial','Helvetica',sans-serif; } .w-cs A:link, .w-cs A:visited, .w-cs A:active, .w-cs A:link B, .w-cs A:visited B, .w-cs A:active B { background: none repeat scroll 0 0 transparent !important; border: medium none !important; color: #000000 !important; font: 10px 'Arial','Helvetica',sans-serif !important; text-decoration: none; } .w-cs A:hover, .w-cs A:hover B { color: #ffffff !important; } .w-cs .w-cs-user-controls .w-cs-group-first, .w-cs .w-cs-group-second { background: none repeat scroll 0 0 #23CCBC; } .w-cs .w-cs-status P { background: none repeat scroll 0 0 transparent !important; border: 0 none; color: #000000; float: none; font: 12px/17px 'Arial','Helvetica',sans-serif; margin: 0; padding: 0; } .w-cs .w-cs-summary { background: none repeat scroll 0 0 #dddddd; border-radius: 2px 2px 2px 2px; float: right; margin: -1px 0 0; padding: 1px 7px; } .w-cs .w-cs-summary LI.w-cs-i-tokens { background-position: 0 -788px; border-right: 1px solid #ffffff; margin-right: 6px; padding: 3px 6px 3px 0; } .w-cs .w-cs-text { background: none repeat scroll 0 0 #dddddd; border: medium none; border-radius: 2px 2px 2px 2px; color: #000000 !important; font-size: 11px; line-height: 14px; margin: 0; padding: 2px 0 3px 5px; vertical-align: top; } .w-cs .w-cs-search .w-cs-text { border-right: 25px solid #dddddd; width: 150px; }
( Explanation of Coding... )