#4401 closed bug (notabug)

Opened March 25, 2009 03:06AM UTC

Closed November 13, 2009 03:09AM UTC

Last modified May 16, 2010 03:27PM UTC

Icons in Tabs Don't Work

Reported by: ZaBlanc Owned by:
Priority: major Milestone: 1.8
Component: ui.tabs Version: 1.7.1
Keywords: tabs, icon Cc:
Blocked by: Blocking:
Description

When I try to do an icon within a tab, the image doesn't line up right and breaks.

Attachments (2)
  • Picture 1.png (7.8 KB) - added by ZaBlanc March 25, 2009 03:07AM UTC.

    Screenshot of issue. Note the icon won't display correctly.

  • test.html (0.7 KB) - added by ZaBlanc March 25, 2009 03:07AM UTC.

    The jQuery code that causes the problem.

Change History (6)

Changed March 28, 2009 12:12AM UTC by scottgonzalez comment:1

component: ui.core → ui.tabs

Changed May 07, 2009 11:13AM UTC by jzaefferer comment:2

milestone: TBD → 1.7.2

Changed May 07, 2009 01:38PM UTC by jzaefferer comment:3

milestone: 1.7.2 → 1.8

Changed August 31, 2009 10:49PM UTC by jzaefferer comment:4

Works without ui-state-default: http://jsbin.com/eyize/edit

Changed October 21, 2009 08:02PM UTC by corey.hart comment:5

As a note, I found that the conflict comes from the .ui-widget-content selector that gets added to both the element wrapper, and the tab pane.

When this happens, the css selector under Interaction States gets triggered:

.ui-state-default, .ui-widget-content .ui-state-default { border: 1px solid #c5dbec; background: #dfeffc url(images/ui-bg_glass_85_dfeffc_1x400.png) 50% 50% repeat-x; font-weight: bold; color: #2e6e9e; outline: none; }

This removes previous background properties set on non descendent selectors.

Changed November 13, 2009 03:09AM UTC by scottgonzalez comment:6

resolution: → invalid
status: new → closed

Icons aren't meant to have states. The states belong on an ancestor.