IE doesn't support putting those two classes together in one selector:
.ui-slider.ui-widget-content
FF understands that (correctly) as meaning "all elements with both a
ui-slider class and a ui-widget-content class". IE ignores all but the last
one, reading it as "all elements with a ui-widget-content class". This is
why it's affecting *way* more elements in IE than you'd like. Since you're
talking about a single element, and it's identified by the ui-slider class,
this should do:
.ui-slider { border: 1px solid #959595 !important; }
- Richard
On Thu, Aug 27, 2009 at 4:02 AM, Nymor <[email protected]> wrote:
>
> Hi,
>
> I'm fairly new to CSS and have been trying to get a border on my
> Sliders. Rather than change the UI-CSS file I'm adding a line to my
> general css with the !important tag. (I'm doing this as I want to keep
> the UI one unchanged so I can apply a different theme if needed
> without having to edit anything afterwards).
>
> The line I've added in my general style.css is:-
>
> .ui-slider.ui-widget-content { border: 1px solid #959595 !important;}
>
> and this works fine in FF (a border on my sliders) but in IE
> everything that is linked in any way to the ui.widget-content now has
> a border (accordians, ui-layouts etc).
>
> Any help in getting the desired result in IE and setting me straight
> on what must be a misunderstanding on my part would be greatly
> appreciated.
>
> In hope....
>
> Regards
> Nymor
> >
>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
