Hi ...
On Fri, 13 May 2005, ced_the.bear wrote:
> Is there a mean to disable default style of tabbedPane tabs.
[...]
We are using the following:
bla.jsp:
<x:panelTabbedPane styleClass="tabbedPane"
activeTabStyleClass="activeTab"
inactiveTabStyleClass="inactiveTab"
disabledTabStyleClass="disabledTab"
activeSubStyleClass="activeSub"
inactiveSubStyleClass="inactiveSub"
tabContentStyleClass="tabContent">
Our used CSS layout class file contains the following:
table
{ border-collapse:collapse ! important;
border-spacing:0px ! important;
padding:0px ! important;
border-width:0px ! important;
empty-cells:show ! important; }
td
{ border-spacing:0px ! important;
padding:0px ! important;
border-width:0px ! important; }
th
{ font-weight:normal ! important;
font-size:80% ! important;
text-align:center ! important;
border:2px solid ! important;
border-color:black #ccc #ccc black ! important;
padding-top:0px ! important;
padding-left:5px ! important;
padding-right:5px ! important;
padding-bottom:0px ! important;
background:#d8d9d4 ! important;
white-space:nowrap ! important; }
table.tabbedPane
{ width:66ex ! important;
height:40ex ! important;
vertical-align:top ! important;
border-collapse:separate ! important;
border-spacing:0px ! important; }
td.activeTab
{ background-color:#e0e0ec ! important;
border-top:2px solid #fff ! important;
border-left:2px solid #fff ! important;
border-right:2px solid #aaacae ! important;
border-bottom:0px none ! important;
padding:2px ! important;
height:4ex ! important;
font-size:80% ! important;
horizontal-align:center ! important;
text-align:center ! important;
-moz-border-radius-topleft:20px ! important;
-moz-border-radius-topright:20px ! important; }
td.activeTab input
{ background-color:#e0e0ec ! important;
font-size:80% ! important;
horizontal-align:center ! important;
text-align:center ! important; }
td.inactiveTab
{ background-color:#c8c8d8 ! important;
border-top:2px solid #e3e5e7 ! important;
border-left:2px solid #ebecef ! important;
border-right:2px solid #8a8c8e ! important;
border-bottom:0px none ! important;
padding:2px ! important;
height:4ex ! important;
font-size:80% ! important;
horizontal-align:center ! important;
text-align:center ! important;
height:4ex ! important;
-moz-border-radius-topleft:20px ! important;
-moz-border-radius-topright:20px ! important; }
td.inactiveTab input
{ background-color:#c8c8d8 ! important;
font-size:80% ! important;
horizontal-align:center ! important;
text-align:center ! important; }
td.activeSub
{ background-color:#e0e0ec ! important;
padding:0px ! important;
border-left: 2px solid #fff ! important;
border-right: 2px solid #aaacae ! important; }
td.inactiveSub
{ background-color:#fff ! important;
padding:0px ! important; }
td.tabContent
{ background-color:#e0e0ec ! important;
border-top: 0px none ! important;
border-left: 2px solid #fff ! important;
border-right: 2px solid #aaacae ! important;
border-bottom: 2px solid #aaacae ! important;
vertical-align:top ! important;
padding:20px ! important;
height:100% ! important;
text-align:justify ! important; }
The "! important" is a way to tell the browser that this adjustment shall
have priority over a builtin style sheet or similar. Depends on the
browser whether it is necessary and/or successfull ;-) The given
configuration works in all important cases we testet (exceptions like the
not-so-important konqueror exist).
HTH,
Alfe
Alexander Fetke
PrismTech (Germany) GmbH
Schoenhauser Allee 6-7, D-10119 Berlin, Germany
Phone: +49-30-440306-34
Fax: +49-30-440306-78
[EMAIL PROTECTED]
www.xtradyne.com | www.prismtech.com
* XTRADYNE Security Infrastructure - a PRISMTECH Product Line *
