Most of the times, I can track down a particular style based on its use. For example, if I want to change the style of the breadcrumbs bar, I just go into the breadcrumbs.css virtual page. Sometimes, though, tracking down the style for a particular element is a bit trickier, so I'll open up the style.css file that gets generated, look for the particular element, then look at the surrounding declarations to see if they will give me a clue as to which CSS virtual file I need to go. It would be helpful, when generating the style.css file, to add a comment line that indicates the beginning of a particular section, like:

/* ====== breadcrumbs.css =========== */

/* ====== various.css =============== */

I hope this wouldn't be too difficult to implement, and, as I mentioned earlier, it would be very helpful in zeroing in on the right CSS file.

Thanks.

Add my vote to that.

I tried to implement it myself by manually adding comments at the top of each virtual CSS file, but all comments get stripped out when the style.css file is written. I finally got the idea to create a "heading" by creating a pseudo CSS selector. Since a hyphen is a valid character for a CSS ID selector, I just created a rule like this at the top of each of my virtual CSS files:

#------content-css-------------------------------------------- {
}

Now when I examine the style.css file, it's a lot easier to see in which virtual CSS file a particular rule is located.