Problem with class names

[DjebbZ]

Hi

I'm not using Foundation (sorry I use Bootstrap...), but it's not related. When using the stylesheets provided in the zip downloaded from the Zurb/Playground site, there's something missing in the declaration. In each stylesheet there is 2 declarations like :

[class*="foundicon-"] { /* global styles */ }
[class*="foundicon-"]:before { /* icon set specific : the font-family property */ }

The problem appeared when I used 2 icons sets : Social and General. The global styles applied well, but the 2nd icon set specific styles got overridden by the first. Changing the second css declaration shown above to :

[class*="social foundicon-"]:before { /* in social_foundicons.css */ }
[class*="general foundicon-"]:before { /* in general_foundicons.css */ }

fixed the problem, as there are no more overrides. Should be easy to fix in the downloads, so nobody else encounters the same problem.

[marccerdan]

and just remember to add the "social" or "general" when you are calling the class ;-)

[jorgebg]

Thanks, it worked for me.
Why is this still not merged?

[bekroogle]

Works for me too, but it means I'll have to include the stylesheets in my repo, instead of loading it from bower. Has anyone done a pull request with these changes?

edit: Never mind; I see there is a pull request.
edit number 2: It looks like the pull request actually changes the classes from .foundicon-github (for example) to foundicon-social-github. I don't think a pull request has been made with DjebbZ's solution