wordpress + kubrick + hReview = trouble
If you try using hReview with Kubrick, the default template for WordPress, you will notice a bit of a problem. You see, hReview has a class called “description”? and so does Kubrick. Unfortunately the default stylesheet for Kubrick styles the description class as white, giving use white on white text- not the easiest to read.
If you’d like to do an hReview with Kubrick, here’s a drop-in stylesheet replacement.
For the the DIY crowd out there, all you need to do is change the .description selector to only select div#headerimg div.description and then move all style rules for .description into that block.
For those of you who have no idea what I’m talking about, just come back later.
June 21st, 2005 at 10:01 pm
And there’ll be an even bigger problem when there are more microformats out there that define overlapping classes… I can think of alternate uses for “description”, “post”, “entry” and “navigation” in particular, and those are just from one blogging tool.
Giving microformats profile URIs (and requiring them on pages that wish to use them) might be a start; at least a page author would have a reference within the page to the names he should avoid/change if he wants to incorporate a particular microformat.
June 21st, 2005 at 10:11 pm
Of course, Peter, adding class names can complicate styling. It mostly means that people will have to be more specific in using CSS selectors.
June 21st, 2005 at 10:53 pm
Styling is definitely an issue, but I was thinking of other (often non-visible) effects. For example, how is a tool supposed to determine that [element class=”foo”] isn’t (or is) being used to represent MicroFooFormat? (Of course, that ventures even further off the topic of the post than my initial comment, so perhaps I should shut up in this particular venue. :)
June 21st, 2005 at 11:16 pm
Peter-
Class name collisions are going to be a problem with microformats, in some cases.
And you’re right, this might not be the right place for this conversation. Perhaps the microformats-discuss mailing list?
December 20th, 2005 at 11:59 am
The more complex microformats seem to keep everything inside a wrapper element with a fairly unique class name (hReview, hCard, hCalendar’s ‘vevent’). This makes it simple in most cases to target CSS selectors pretty specifically in most cases.
December 20th, 2005 at 12:48 pm
Dougal-
The problem in this case was that Kubrick had some CSS selectors which were too broad, selecting without context.
December 20th, 2005 at 1:34 pm
I think you’re probably right that the Kubrick selector was too generic. I just worry that renaming the selector might be a hasty move.
And since hReview is the “foreign” element here, I think it would be more prudent (at least, in the grand scheme of things) to target a fix there, first.
I’m not wholly against altering Kubrick (I won’t say “fix”, since it’s not technically broken) to work around this. As more people try out microformats (probably many via the StructuredBlogging plugin), it’s likely to become a more widespread problem. But I can’t help but think that if you’re shoe-horning outside data into an existing template, it makes more sense to make the data work with the template, and not vice-versa.
But maybe that’s just me.
December 20th, 2005 at 2:04 pm
How would you propose fixing it? I really didn’t see a reasonable way to change the markup and/or styles so that the hreview would not be affected by the Kubrick styles. Changing the hreview schema is out of the question in this case.
December 20th, 2005 at 3:32 pm
Add a style targeted at the hReview element:
.hReview .content { background-color: inherit; color: inherit; }
That would set the background and foreground colors of the hReview description to the same as it’s parent element (inheriting up as far as it needs to).
No need to change the hReview schema. Just explicitly specify how you want it displayed.
December 20th, 2005 at 6:17 pm
dougal-
Indeed. That would certainly solve the problem in this case.
I guess I was trying to solve the problem in a way that would eliminate other problems (like other microformats that use .summary).