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.
 
 
And this link on tab style¡­
 
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

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.

Reply via email to