An Important Update

Dear Followers Of This Blog ...

If you did not use a Blogger / Google account when you Followed this blog, years ago, you are probably not Following now . During the past...

Sunday, March 08, 2015

Defect In The Watermark Template Tabs Section

Occasionally in Blogger Help Forum: Get Help with an Issue, we see a report of template inconsistency, in the Tabs Menu.
Most of the tabs links work fine - the pages pop right up. The two tabs on the far right, you can't click them and they don't act as links.
When we check the published blog code, the pages gadget looks normal - the two tabs reported just, mysteriously, refuse to operate.

The easiest solution, to this problem, is just to make the tabs section narrower.
Change the tabs captions, make all of the tabs smaller, and the ones on the right will be fine.
This strategy works OK, if the pages, indexed in tabs, can be renamed. But not all owners are interested in re captioning their tabs - and some tabs can't be easily re captioned.

Fortunately, there is an easier way to fix this. The problem here is with the code, in the Watermark template - and a simple CSS fix will take care of the problem.

To correct the problem, use the "Add CSS" wizard, in the Template Designer Advanced menu, and add two rules.

.tabs .widget ul {
width: 100%;
overflow: visible;
}

.main-cap-top .cap-left {
z-index: -1;
}

Copy the above two rules, plus leading and trailing blank lines, into the "Add CSS" window. Then hit "Apply to Blog" - and test your change.

And please, as always, backup the template before and after making this change.

Dude, hit me with a comment!