Gmail Calendar Documents Reader Web more »
Recently Visited Groups | Help | Sign in
Google Groups Home
Vertical Tabs example....
There are currently too many topics in this group that display first. To make this topic appear first, remove this option from another topic.
There was an error processing your request. Please try again.
flag
  3 messages - Collapse all  -  Translate all to Translated (View all originals)
The group you are posting to is a Usenet group. Messages posted to this group will make your email address visible to anyone on the Internet.
Your reply message has not been sent.
Your post was successful
 
From:
To:
Cc:
Followup To:
Add Cc | Add Followup-to | Edit Subject
Subject:
Validation:
For verification purposes please type the characters you see in the picture below or the numbers you hear by clicking the accessibility icon. Listen and type the numbers you hear
 
Dan G. Switzer, II  
View profile  
 More options Aug 27 2007, 1:25 pm
From: "Dan G. Switzer, II" <dswit...@pengoworks.com>
Date: Mon, 27 Aug 2007 13:25:32 -0400
Local: Mon, Aug 27 2007 1:25 pm
Subject: Vertical Tabs example....
Does anyone have any CSS examples of any vertical, right-aligned tabs using
Klaus' Tabs plug-in?

-Dan


    Reply to author    Forward  
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
Giuliano Marcangelo  
View profile  
 More options Aug 27 2007, 3:42 pm
From: "Giuliano Marcangelo" <giuliano.marcang...@gmail.com>
Date: Mon, 27 Aug 2007 20:42:56 +0100
Local: Mon, Aug 27 2007 3:42 pm
Subject: Re: [jQuery] 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 <dswit...@pengoworks.com> wrote:

  jquery.tabs.css
3K Download

  jquery.tabs-ie.css
< 1K Download

    Reply to author    Forward  
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
Dan G. Switzer, II  
View profile  
(1 user)  More options Aug 28 2007, 9:52 am
From: "Dan G. Switzer, II" <dswit...@pengoworks.com>
Date: Tue, 28 Aug 2007 09:52:01 -0400
Local: Tues, Aug 28 2007 9:52 am
Subject: RE: [jQuery] Re: Vertical Tabs example....

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:jquery-en@googlegroups.com] 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 <dswit...@pengoworks.com> wrote:

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

-Dan


    Reply to author    Forward  
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
End of messages
« Back to Discussions « Newer topic     Older topic »

Create a group - Google Groups - Google Home - Terms of Service - Privacy Policy
©2009 Google