Topic: request for help about active and inactive tab concept

can anybody povide me some information that how to use active and inactive tab concept in a project.if any bodu can not understand the question i am providing this link.http://web--templates.org/tab-menus/website-tab-navigation-dhtml.html.it is for tabbed navigation with submenu.

Re: request for help about active and inactive tab concept

You will probably want to look into using Descendant Selectors:
http://www.w3.org/TR/CSS2/selector.html … -selectors

A good ref: http://alistapart.com/articles/slidingdoors2/

See it in action:
Will post the code I used later.

Last edited by Bink (2007-06-11 11:39:55)

Re: request for help about active and inactive tab concept

Your CSS code would look something like:

#main li {
    display: inline;
    padding: 0px;
    margin: 0px 7px;
    text-transform: uppercase;
}
#main li a {
    text-decoration: none;
    color: #FFFFFF;
    font: normal 12px Verdana, Arial, Helvetica, sans-serif;
        background: url(../images/white_bg.jpg) /* For the regular tab */
}

#main li a:hover {
    text-decoration: none;
    color: #e0b93b;
    font: normal 12px Verdana, Arial, Helvetica, sans-serif;
        background: url(../images/gray_bg.jpg) /* For the hover tab */
}
#main li a.activestate {

    text-decoration: none;
    color: #e0b93b;
    font: normal 12px Verdana, Arial, Helvetica, sans-serif;
        background: url(../images/red_bg.jpg) /* For the active tab */
}


And the HTML:
<div id="main">
<ul>
<li>
  <a class="activestate" href="index.html">Link Active</a><!-- This is the Active Tab -->
</li>
<li>
  <a href="../1/1.html">Link</a>
</li>
<li>
  <a href="../2/2.html">Link</a>
</li>
</ul>
</div>

Alternatively, you can use either an image or a mere background color for the tabs.

Last edited by carmelyne (2007-05-30 19:04:22)

<= Will buy you beer for some Ruby Help