How can I specify a background image for a content query Webpart in SharePoint 2010?

Question

How can I style the background of a content query webpart in SharePoint 2010?

I have been having a look around, and can't seem to figure it out. I am able to edit the individual item styles using the ItemStyle.xsl file in SharePoint designer, but I need a background image on the container.

I have referenced the class that is generated by SharePoint - 'WebPartWPQ4' - in CSS, and made it work that way, but that changes the styles for all web parts in the system. (This also feels like a bit of a hack)

Any help would be greatly appreciated.

Answer 1

The way I have solved this is to wrap the webpart zone in a div in the .aspx page file. You can then reference this div in a css file.

Answer 2

It is totally okay that you try to override custom styles in your css (although 'WebPartWPQ4' is not the best choice). However, to get what you need, just ensure that the web part you want to style has some wrapper around it and change selector in your css to .wrapper > .WebPartWPQ4 so that only this instance of the web part gets styled.