Create a ticket and attach the screenshots.
I'm not much in CSS and I cannot imagine how this whitespace breaks
the layout. But I don't see a problem to remove them too.
On Tue, Sep 18, 2012 at 3:07 PM, Lemke, Michael SZ/HZA-ZSW
<lemke...@schaeffler.com> wrote:
> On Tue, Sep 18, 2012 1:51 PM
> Martin Grigorov wrote:
>>On Tue, Sep 18, 2012 at 2:29 PM, Lemke, Michael SZ/HZA-ZSW 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, I just did this. Works fine. But is there a chance
> it gets fixed in Wicket? Or isn't this considered a problem?
>
> Michael
--
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
