Re: tabbedPane - style question?

[Gerald Müllan]

Hi,

I don`t think it is possible to style div elements or other dom nodes
with css in order to get rounded shapes. But I know that the rico js
library has some features to get round corners.

Have a look at:

http://openrico.org/rico/demos.page?demo=rico_effect_round

cheers,

Gerald

On 5/6/06, Dave <[EMAIL PROTECTED]> wrote:

How to make tab border corner round?  Can it be done using CSS?

Thanks!

Jeffrey Porter <[EMAIL PROTECTED]> wrote:



Thanks Jeremy,


I found this for an age old version JSF.
http://209.61.157.8:8080/taglibs/


And this link on tab style＃
http://www.mail-archive.com/users@myfaces.apache.org/msg04006.html

It＊s a start. I＊d like to get my tab＊s looking like they do in the first
link, I feel this isn＊t possible at the moment though.
(MyFaces limitation)


Jeff

-----Original Message-----
From: Jeremy Sager [mailto:[EMAIL PROTECTED]
Sent: 26 January 2006 15:18
To: 'MyFaces Discussion'
Subject: RE: tabbedPane - style question?

Here＊s an example Jeff. Note that I＊m not using disabledStyleClass because
in my pane, no tabs will ever be disabled. Also note that to change the look
& feel of the tab buttons, I use two additional css entries. The CSS here
has a lot of duplicate stuff and needs to be cleaned up a lot, but it should
be a good starting point for you.

<t:panelTabbedPane id="editorPane"
                                activeTabStyleClass="editorPane_activeTab"
                      inactiveTabStyleClass="editorPane_inactiveTab"
                      tabContentStyleClass="editorPane_tabContent"
                                inactiveSubStyleClass="editorPane_subStyle"
                                activeSubStyleClass="editorPane_subStyle">


.editorPane_activeTab {
    background-color: #316AC5 !important;
      font-family: verdana;
      font-size: 10px;
      font-color: #FFFFFF !important;
      padding: 4;
}
.editorPane_inactiveTab {
    background-color: #EFEFE7 !important;
    border-style: solid  !important;
      border-width: 1px  !important;
      border-color: #444444  !important;
      font-family: verdana !important;
      font-size: 10px !important;
      margin-left: 2em;
      margin-right: 2em;
}

.editorPane_tabContent {
    background-color: #FFFFFF !important;
    border-style: solid  !important;
      border-right-width: 1px  !important;
      border-left-width: 1px  !important;
      border-bottom-width: 1px  !important;
      border-top-width: 0px  !important;
      border-color: #000000  !important;
      font-family: verdana !important;
      font-size: 10px !important;
      margin:0;
      padding:0;
}

.myFaces_panelTabbedPane{
      background-color: #316AC5 !important;
    border-style: solid  !important;
      border-width: 0px  !important;
      border-color: #000000  !important;
}

.editorPane_inactiveTab input{
      padding: 4;
      font-family: verdana;
      font-size: 10px;
      background-color: transparent !important;
      color: #000000;
      border:0;
}

.editorPane_activeTab input{
      padding: 4;
      font-family: verdana;
      font-size: 12px;
      background-color: transparent !important;
      color: #FFFFFF;
      border:0;
}



Jeremy Sager
Data Communications Product Manager
Chesapeake System Solutions
410.356.6805 x120
[EMAIL PROTECTED]

 ________________________________

From: Jeffrey Porter
[mailto:[EMAIL PROTECTED]
Sent: Thursday, January 26, 2006 9:45 AM
To: MyFaces Discussion
Subject: tabbedPane - style question?


Does anyone know of any examples of using a t:tabbedPane and changing the
look and feel of them?

Thanks
Jeff





 ________________________________
Get amazing travel prices for air and hotel in one click on Yahoo! FareChase

 ________________________________
Yahoo! Mail goes everywhere you do. Get it on your phone.

--
Gerald Müllan
Schelleingasse 2/11
1040 Vienna, Austria
0043 699 11772506
[EMAIL PROTECTED]