Hi,

On Tue, Sep 18, 2012 at 2:29 PM, Lemke, Michael  SZ/HZA-ZSW
<lemke...@schaeffler.com> wrote:
> I've encountered a layout problem with TabbedPanels.  In the
> generated markup there is whitespace between the LI items and
> the anchor that switches tabs.  This causes a layout problem for me
> with this style sheet (simplified to show the issue, not tested):
>
> .selected a {
>     background: url("../i/bg_tab_lw_content_active.gif") repeat-x scroll 
> center top #E8EEF1;
>     border-right: 1px solid #CDD3D6;
> }
>
> a {
>     background: none repeat scroll 0 0 transparent;
>     border-right: 1px solid #FFFFFF;
> }
>
> li {
>     display: inline;
>     margin: 0;
>     list-style: none outside none
> }
>
> The idea is to have a white border between the tabs which
> disappears for the selected tab.  Kind of hard to explain
> without screenshots.  Currently with Wicket there is always
> a small margin left or right of the white border of the A
> element.  It is caused by whitespace in the markup.
>
> li { float:left; } would remove the undesired whitespace
> but would break the rest of our layout.
>
>
> Anyway, the root cause is the markup in TabbedPanel.html of
> Wicket.
>
> Current (1.5.8 and 6.0.0):
>
> <wicket:panel xmlns:wicket="http://wicket.apache.org";>
> <div wicket:id="tabs-container" class="tab-row">
> <ul>
>         <li wicket:id="tabs">
>                 <a href="#" wicket:id="link"><span wicket:id="title">[[tab 
> title]]</span></a>
>         </li>
> </ul>
> </div>
> <div wicket:id="panel" class="tab-panel"><!-- no panel --></div>
> </wicket:panel>
>
>
> Should be changed in e.g.
>
> <wicket:panel xmlns:wicket="http://wicket.apache.org";>
> <div wicket:id="tabs-container" class="tab-row">
> <ul>
> <li wicket:id="tabs"><a href="#" wicket:id="link"><span 
> wicket:id="title">[[tab title]]</span></a></li>
> </ul>
> </div>
> <div wicket:id="panel" class="tab-panel"><!-- no panel --></div>
> </wicket:panel>
>
>
> Is there a Wicket way to work around this?

You can create MyTabbedPanel that extends TabbedPanel and provides
MyTabbedPanel.html.
The only code in .java that is needed to add is the constructor(s) you use.

>
> Thanks for any insight,
> Michael
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
> For additional commands, e-mail: users-h...@wicket.apache.org
>



-- 
Martin Grigorov
jWeekend
Training, Consulting, Development
http://jWeekend.com

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
For additional commands, e-mail: users-h...@wicket.apache.org

Reply via email to