2 Replies Latest reply: May 11, 2012 2:11 AM by robli RSS

    af:panelTabbed CSS query ?


      I have ...
      af|panelTabbed::header af|panelTabbed::tab:disabled af|panelTabbed::tab-start,
      af|panelTabbed::header af|panelTabbed::tab:hover af|panelTabbed::tab-start af|panelTabbed::tab:disabled {
          background-image: url("../images/tabbed-left.png");
      af|panelTabbed::header af|panelTabbed::tab:disabled af|panelTabbed::tab-end,
      af|panelTabbed::header af|panelTabbed::tab:hover af|panelTabbed::tab-end af|panelTabbed::tab:disabled {
          background-image: url("../images/tabbed-right.png");
      af|panelTabbed::header af|panelTabbed::tab:disabled af|panelTabbed::tab-content,
      af|panelTabbed::header af|panelTabbed::tab:hover af|panelTabbed::tab-content af|panelTabbed::tab:disabled {
          background-image: url("../images/tabbed-center.png");
      ... in the skin CSS and whilst the hover settings for the tab-start and tab-end work fine, they don't for the tab-content. Instead the hover setting ...
      af|panelTabbed::header af|panelTabbed::tab:hover af|panelTabbed::tab-start {
          background-image: url("../images/tabbed-hover-left.png");
      af|panelTabbed::header af|panelTabbed::tab:hover af|panelTabbed::tab-end {
          background-image: url("../images/tabbed-hover-right.png");
      af|panelTabbed::header af|panelTabbed::tab:hover af|panelTabbed::tab-content {
          background-image: url("../images/tabbed-hover-center.png");
      ... gets applied. The hover settings for the tab-start & tab-end get ignored OK when the tab is disabled, but not for tab-content.

      Is there an ordering here that I'm missing ? I've rehashed the failing tab-content setting any number of ways.

        • 1. Re: af:panelTabbed CSS query ?
          Frank Nimphius-Oracle


          af|panelTabbed::header af|panelTabbed::tab:hover af|panelTabbed::tab-start af|panelTabbed::tab:disabled

          have commas between

          af|panelTabbed::header, af|panelTabbed::tab:hover, af|panelTabbed::tab-start, af|panelTabbed::tab:disabled

          or do you really need all of these to be true in exact that order for the CSS to be applied ?

          • 2. Re: af:panelTabbed CSS query ?
            Thanks Frank.

            Yes, the requirement is that if the tab-content is part of a disabled tab then it applies image A irrespective of whether mouse is hovering over it or not. As I understand it, one needs to string the style references together to create that specific condition. My problem is that the browser is honoring the more general hover setting for the center and not the hover disabled setting. Works OK however for the tab-start & tab-end sections of the tab.

            Does this sound like a bug ?