Unique Styling

Hi,

Maybe someone can offer help here. I’m trying to style unique instances of the widget on my homepage, with different widgets having different size thumbnails and font sizes for their titles. Also, there are two instances of the columns display, one with two columns and one with three.

Because title/post-excerpt options have to be adjusted to thumbnails with padding, this effort requires lots of adjustments. Not only do the titles, excerpts, and thumbnails have to be appropriately sized and spaced, the column widths have to be adjusted as well to accommodate the different instances of the multi-column widget.

I’m sure this can all be achieved through the widget ID and css class boxes, but I’m not sure how to use them. I’ve replicated all the relevant code and adjusted class names for the purpose (see an example below—n.b. adjustment is capitalized), I just need to know what to do next.

All help is appreciated. Thanks!

/* The single post title. */
div.srp-widget-container h4.srp-post-title {
	font-size: 20px;
	text-align: justify;
	padding-right: 22px;
	display: block;
}

div.srp-widget-container H4.SRP-POST-TITLE1 {
	font-size: 28px;
}

The site is here. The different instances on the widget are not yet live, but perhaps someone with more knowledge than me can find some clue there.

http://ww.wp.xz.cn/plugins/special-recent-posts/