JqueryUI圖標與ui狀態錯誤不工作在對話框

Question

我有一個ninput和兩個跨度，每個都有一個jQuery UI圖標，我試圖在jQuery UI對話框中內聯顯示。

當我嘗試將ui-state-error應用於跨度時，會出現此問題。

對話框外的圖標工作正常，在對話框內，但圖標不能正確顯示...！

思想???

http://jsfiddle.net/kralco626/K6TzK/8/

Answer 1

如果你給你彈出div的ID，添加以下你的CSS來解決這個問題：

#popupDiv > .ui-state-error { 
    background-position: -32px -192px; 
} 

這應該引起你的頁面上任何其他的影響微乎其微。

Demo on jsfiddle

Answer 2

的ui-state-error類第一<span>與小部件內的圖標造成問題的原因。

jQuery UI主題css在小部件內部有一個不同的background規則，即覆蓋另一個背景。

.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {border: 1px solid #cd0a0a; background: #fef1ec url(images/ui-bg_glass_95_fef1ec_1x400.png) 50% 50% repeat-x; color: #cd0a0a; } 

你可以從你的<span>動手清除的ui-state-error類來解決它，但可能不是正是你所追求的，如果你需要的紅「警報」的輪廓。

Answer 3

其實問題並不只是在錯誤的任何部件在對話中。我很確定爲什麼，但是在對話框中CSS權重會變得不同。

反正長話短說，你只需要添加CSS，你需要使用的圖標：

#popupDiv > .ui-icon-circle-close { 
    background-position: -32px -192px; 
} 

可以看到在這個小提琴：http://jsfiddle.net/8J395/

希望它可以幫助別人。