Title: [Plugin: WordPress Post Tabs] 'Fade' Effect Causing Problems in IE
Last modified: August 20, 2016

---

# [Plugin: WordPress Post Tabs] 'Fade' Effect Causing Problems in IE

 *  Resolved [Copernicus](https://wordpress.org/support/users/copernicus/)
 * (@copernicus)
 * [15 years ago](https://wordpress.org/support/topic/plugin-wordpress-post-tabs-fade-effect-causing-problems-in-ie/)
 * Great plugin!
    Everything is working wonderfully except in **IE8** when the **
   tabs ‘Fade’ effect is enabled** on the **“Default” tab style**.
 * On initial page load, the display is as expected; but once one of the tabs is
   clicked, the content is pushed to the right (aligning with the right edge of 
   the current tab).
 * This only seems to happen in Internet Explorer (I’m seeing it in IE8).
    Other
   browsers are working perfectly. Also, the “Gray” and “Red” themes do not experience
   this problem — only the “Default” tabs style.
 * As far as I can tell, it has something to do with the code that is dynamically
   added to perform the fade effect transition; but I can’t tell what code specifically
   is causing the issue.
 * Anyone else seeing this or have a fix?
 * [http://wordpress.org/extend/plugins/wordpress-post-tabs/](http://wordpress.org/extend/plugins/wordpress-post-tabs/)

Viewing 1 replies (of 1 total)

 *  Thread Starter [Copernicus](https://wordpress.org/support/users/copernicus/)
 * (@copernicus)
 * [15 years ago](https://wordpress.org/support/topic/plugin-wordpress-post-tabs-fade-effect-causing-problems-in-ie/#post-2090826)
 * Found the problem.
 * Apparently, IE doesn’t like the 32px height set for “.ui-tabs-nav” in the default
   tabs stylesheet.
 * To fix the issue, I did the following:
 * On **line 4 of style.css** of the “default” tabs style (found in “wp-content/
   plugins/wordpress-post-tabs/css/styles/default”), I changed
 * `ul.ui-tabs,ul.ui-tabs-nav{margin:0 !important;height:32px;background:#EFEFEF;
   font-size:13px;font-family:Arial, Helvetica, sans-serif;font-weight:bold;line-
   height:24px !important}`
 * to
 * `ul.ui-tabs {margin:0 !important;height:32px;background:#EFEFEF url(images/tabs-
   bg.gif) repeat-x;font-size:13px;font-family:Arial, Helvetica, sans-serif;font-
   weight:bold;line-height:24px !important}*/`
 * (changes: I removed “ul.ui-tabs-nav” and added a background image “tabs-bg.gif”
   that is a 33px high GIF of a solid color (#efefef, in this case).
 * On the next line, I added a new style of:
    `.ui-tabs-nav { background: url(images/
   tabs-bg.gif) repeat-x; height: 36px; }`
 * This sets the height to 36px which accommodates the height of the little arrow&
   makes IE happy.
 * Hope this helps someone!

Viewing 1 replies (of 1 total)

The topic ‘[Plugin: WordPress Post Tabs] 'Fade' Effect Causing Problems in IE’ is
closed to new replies.

 * ![](https://s.w.org/plugins/geopattern-icon/wordpress-post-tabs_ffffff.svg)
 * [WordPress Post Tabs](https://wordpress.org/plugins/wordpress-post-tabs/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/wordpress-post-tabs/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/wordpress-post-tabs/)
 * [Active Topics](https://wordpress.org/support/plugin/wordpress-post-tabs/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/wordpress-post-tabs/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/wordpress-post-tabs/reviews/)

 * 1 reply
 * 1 participant
 * Last reply from: [Copernicus](https://wordpress.org/support/users/copernicus/)
 * Last activity: [15 years ago](https://wordpress.org/support/topic/plugin-wordpress-post-tabs-fade-effect-causing-problems-in-ie/#post-2090826)
 * Status: resolved