May 13th, 2013LWTB: Positioning problem of the tabs
Knowledge Base support case for Likno Web Tabs Builder, abstracted and stripped of all user’s private info.
Initial Email From: John
Initial Email Subject: Unexpected behavior in Tabs
Support Case Month: April 2013
I have looked everywhere that i can think off, but cannot find the style to correct this problem.
When I initially go to this page, the tabs menu looks correct. As I click across the menu (Description > Features > Contact Us), the menu works as planned.
However, if I next click on Description, the body copy moves up to the edge of the top margin of the body graphic and will not return, unless the page is reset.
I also can correct the problem by finding the code using Firebug and changing the "positioning" style from "Relative" to "Absolute" (see below).
<li class="liknotabs_body" style="width: 700px; position: relative; top: 0px; left: 0px; display: block; overflow: visible; height: 295px; padding-top: 0px; padding-bottom: 0px; margin-top: 0px; margin-bottom: 0px; border-top-width: 0px; border-bottom-width: 0px;">
However, I cannot find the place in the Tabs menu application to make this change.
Reply From: Likno Customer Support
It seems that this issue is caused by the way that browsers understand margin. Specifically, the problem is that margins need some kind of “wall” to push against, otherwise they are ignored.
If for example you add a 1px padding-top to your <div class="synecomm"> and remove the margin-top, you will get the result you wanted, because the 15px margin of the inner elements will work against this padding.
If you need more help, please export and send me the tabs project and I will do this for you.
Likno Customer Support
Like us on Facebook – Follow us on Twitter
Reply From: John
Worked great! Thank you very much.