panelTabbedPane styles

[Steve Horne <st...@gmail.com>]

I am trying to change the look of a panelTabbedPane that differs from
the styles provided in the myfaces-all.jar
org.apache.myfaces.custom.tabbedpane.resource.defaultStyles.css. 
Because the faces servlet injects the stylesheet AFTER my stylesheet,
I cannot seem to remove the border lines, button rendering, etc...

What is the 'correct' way to drastically change the look of a panelTabbedPane?

--
A strong conviction that something must be done is the parent of many
bad measures.
  - Daniel Webster

RE: panelTabbedPane styles

[Julian Ray <ju...@yahoo.com>]

Here is my customization. Note use if ! Important to override the default
styles

/* For tabbed Panes */
table.tabbedPane { 
	width: 100%! important;
    vertical-align: top ! important;
    border-collapse: separate ! important;
    border-spacing: 0px ! important; 
    background-color: #FFFFFF;
}
td.activeTab { 
    width: 9% ! important;
    font-size: 100% ! important;	
	background-color: #FFFFFF ! important;
    border-top: 1px solid #91A0CA ! important;
    border-left: 1px solid #91A0CA ! important;
    border-right: 1px solid #91A0CA ! important;
    border-bottom: 0px none ! important;
    padding: 2px ! important;
    horizontal-align:center ! important;
    text-align: center ! important;
    font-weight: bold ! important;
}
td.activeTab input { 
	background-color: #FFFFFF ! important;
    font-size: 100% ! important;	
    horizontal-align: center ! important;
    text-align: center ! important; 
    font-weight: bold ! important;
}
td.inactiveTab { 
    width: 9% ! important;
    font-size: 100% ! important;	
	background-color: #EBEEF8 ! important;
    border-top: 1px solid #91A0CA ! important;
    border-left: 1px solid #91A0CA ! important;
    border-right: 1px solid #91A0CA ! important;
    border-bottom: 1px solid #91A0CA ! important;
    padding: 2px ! important;
    horizontal-align:center ! important;
    text-align: center ! important;
    font-weight: bold ! important;
}
td.inactiveTab input { 
	background-color: #EBEEF8 ! important;
    font-size: 100% ! important;	
    horizontal-align:center ! important;
    text-align:center ! important; 
    font-weight: bold ! important;
}
td.activeSub { 
	background-color: #FFFFFF ! important;
    padding: 0px ! important;
    border: 1px solid #FFFFFF ! important;
}
td.inactiveSub { 
	background-color: #FFFFFF ! important;
    padding: 0px ! important; 
    border: 1px solid #FFFFFF ! important;
}
td.myFaces_panelTabbedPane_emptyHeaderCell {
	background-color: #FFFFFF ! important;
    border-bottom: 1px solid #91A0CA ! important;
    border-left: 0px none ! important;
    border-right: 0px none ! important;
    border-top: 0px none ! important;
}
.myFaces_panelTabbedPane_activeHeaderCell input:hover,
.myFaces_panelTabbedPane_inactiveHeaderCell input:hover{
	border-top: orange solid 1px ! important;
}

td.tabContent { 
	background-color: #FFFFFF ! important;
    border: 0px none ! important;
    vertical-align: top ! important;
    padding-top: 5px ! important;
    padding-left: 0px ! important;
    padding-right: 0px ! important;
    height: 100% ! important;
} 

-----Original Message-----
From: Steve Horne [mailto:stevehorne@gmail.com] 
Sent: Friday, May 05, 2006 12:07 PM
To: users@myfaces.apache.org
Subject: panelTabbedPane styles

I am trying to change the look of a panelTabbedPane that differs from the
styles provided in the myfaces-all.jar
org.apache.myfaces.custom.tabbedpane.resource.defaultStyles.css. 
Because the faces servlet injects the stylesheet AFTER my stylesheet, I
cannot seem to remove the border lines, button rendering, etc...

What is the 'correct' way to drastically change the look of a
panelTabbedPane?

--
A strong conviction that something must be done is the parent of many bad
measures.
  - Daniel Webster