Charles, As it stands, there is not an all-around good way to handle this. It also *doesn't* take into account selector specificity - it parses the document, grabs the styles for each selector, and concatenates it into a string, assigning it to your semantic classes/ids.
I'm honestly not sure how reassigning from ids to classes worked for you. Regardless, you're right in that the styles get mashed together and the margins for pull/push were messing things up, it seems. As for a solution, I don't have one that I support 100% as semantic classes have always been a very rudimentary solution to a complex issue. You could copy these semantic classes to your custom stylesheet and modify them as needed. The other solution that I've been looking into is using LESS (http://lesscss.org) and using the mixin capabilities. However, LESS doesn't work with the span-X classes (yet) - if you go to the issue page for this bug (http:// github.com/cloudhead/less/issues/#issue/62), you can vote the issue up by clicking on the up arrow next to the issue title near the top of the page to let him know the resolution of this issue is important to you. A third solution would be to write some patches for Blueprint to achieve what you'd like to do. Best of luck! On Aug 26, 3:53 am, Charles Roper <[email protected]> wrote: > On Aug 26, 8:29 am, Charles Roper <[email protected]> wrote: > > > Would adding specific id selectors to the .column, div.span-1, [...] > > {float:left;margin-right:20px;} rule help? E.g. > > > .column, div.span-1, div#span-1, [...] {float:left;margin-right:20px;} > > Ahh, the penny just dropped as to why seemingly redundant declarations > are made in the settings.yml example file: > > semantic_classes: > "#footer, #header": ".span-24, div.span-24" > "#content": ".span-17, div.span-17, div.colborder" > "#extra-content": ".span-6, div.span-6" > "div#navigation": "div.span_24, .span-24" > "div.section, div.entry, .feeds": ".span-6 div.span-6" > > Adding, say, div.span-24 overrides other less specific declarations, > such as .push. Got it now. > > The resulting CSS is quite messy, though: > > /* semantic class names */ > #footer, #header {float:left;margin-right:20px;width:940px;margin- > right:0;} > #primary {float:left;margin-right:20px;width:460px;margin:0 -240px > 1.5em 240px;float:right;position:relative;} > #secondary {float:left;margin-right:20px;width:220px;margin- > left:-720px;float:left;position:relative;} > #tertiary {margin-right:0;padding-right:0;float:left;margin-right: > 20px;margin-right:0;width:220px;} > > There is some redundancy and duplication in there. It could do with a > parser that mops up any redundant property declarations from left to > right. For example, in #tertiary, the first margin-right can go and > the second one also. It's not critical, but would make things neater > and less, uh, itchy for anal retentives like me. :) > > Charles --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Blueprint CSS" 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/blueprintcss?hl=en -~----------~----~----~----~------~----~------~--~---
