1 Reply Latest reply on Jul 25, 2008 6:39 AM by rob_ma

    No Space between tab-headers

    rob_ma

      Hello there.

      I am trying to change the design of a tabpanel with 2 tabs.

      In the header of each tag there is a graphic instead of plain text. this works fine.
      the problem is, there are spaces between on the left side of the two tabs, between them and on the right side. each space has a width of 1px.

      here is the html code for one of these spaces:

      <tbody>
      <tr>
      <td class="dr-tbpnl-tbbrdr rich-tabhdr-side-border">
      <img height="1" border="0" width="1" src="/webapp_homepage/spring/a4j_3_2_1-SNAPSHOTimages/spacer.gif"/>
      </td>
      <td class="dr-tbpnl-tbtopbrdr rich-tabhdr-side-cell" style="width: 122px;">
      <table cellspacing="0" cellpadding="0" border="0" style="height: 100%; width: 100%;">
      <tbody>


      so ther is an image (spacer.gif) in a td-element. when i changed the width and height of the element to 0 using the firefox plugin FireBug, it works fine.

      Is there a way to permanently change these attributes or even to tell the rendering engine not to include these spaces?

      i hope i described it good enough for someone to understand :)
      if you need to know something, please post it!

      thanks in advance!



        • 1. Re: No Space between tab-headers
          rob_ma

          Here is the code of the xhtml page with the rich:tabPanel and rich:tab elements (nothing special at all):


          <rich:tabPanel switchType="client" height="150" activeTabClass="tab-cell-active" inactiveTabClass="tab-cell-inactive" headerSpacing="0px">
          
          <rich:tab labelWidth="122" styleClass="tab-header">
          
           .......
          
          </rich:tab>
          <rich:tab labelWidth="122" styleClass="tab-header">
          
           ......
          
          </rich:tab>
          </rich:tabPanel>