[jQuery] Re: Vertical Tabs example....

[Dan G. Switzer, II]

Giuliano,

 

Thanks. I'd done a similar hack, but was hoping to find some examples where
the tabs correctly aligned with the content edge and where the tabs showed
the open gap on the selected tabs.

 

I'll just need to work on this later if know one has a working example.

 

-Dan

 

  _____  

From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Giuliano Marcangelo
Sent: Monday, August 27, 2007 3:43 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Re: Vertical Tabs example....

 

Dan,

very quick and dirty experiment , using Klaus's test page (you can tweak the
css to suit your particular needs)....and only tested in FF and IE7....

for each div id="container-n"....add a class of "container"...........and
use the attached stylesheets ........... 

changes (from original):

.tabs-nav {
    float:right;
    list-style: none;
    margin: 0;
    padding: 0 0 0 4px;
}
.tabs-nav:after, .container:after{ /* clearing without presentational
markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
.tabs-nav li {
    display: block;
    margin: 0 0 0 1px;
    min-width: 84px; /* be nice to Opera */
}

.tabs-container {
    float:left;
    width:80%;
    border: 1px solid #97a5b0;
    padding: 1em 8px;
    background: #fff; /* declare background color for container to avoid
distorted fonts in IE while fading */ 
}


and IE:
.tabs-nav, .container { /* auto clear */
    display: inline-block;
}


Hope this helps a little.....:-)



On 27/08/07, Dan G. Switzer, II <[EMAIL PROTECTED]> wrote:


Does anyone have any CSS examples of any vertical, right-aligned tabs using
Klaus' Tabs plug-in?

-Dan