Less broad CSS rules for styling ticket #properties table

[Ethan Jucovy <ethan.jucovy@…>]

I've set up a Trac site that loads a Javascript WYSIWYG editor to edit the ticket description field. The WYSIWYG editor creates a <table> to present a toolbar to the user.

Trac's ticket.css contains rules for #properties table which make the layout of this toolbar table look wrong, because it's a <table> that's a descendent of the <fieldset id="properties">. So, in order to make the WYSIWYG toolbar display properly, I need to track down all the #properties table rules and suppress them with a more specific CSS selector in my own stylesheet.

However, Trac's CSS rule is unnecessarily broad. The only table that the CSS is trying to style is a direct child of the properties fieldset, so using selectors like #properties > table instead of #properties table would have the same effect without accidentally styling other tables that might be inserted within the #properties node. I believe the CSS child selector has been supported in all browsers for a while now (IE7+).

[Ethan Jucovy <ethan.jucovy@…>]

If using the CSS child selector is problematic, the same effect could be achieved by adding a class or ID to the relevant table to make the selector more specific. I'm not sure which approach is considered better, so I've attached two patches.

[Ethan Jucovy <ethan.jucovy@…>]

Use multiple child selectors in each rule (table > tbody > tr etc)

[Ethan Jucovy <ethan.jucovy@…>]

Actually neither of my first two patches is sufficient, because of course the inner table's <th>s and <td>s are still caught by the rule. attachment:ticket_css_propertiestable_multiple_child_selectors.diff​ fixes this by using a lot of child selectors (e.g. #properties > table > tbody > tr > th) which makes the application of the rules sufficiently specific.

[Christian Boos]

I didn't look at the specifics of the problem yet, but just seeing your latest patch, I think you should aim for simple and efficient CSS by adding whatever is required in terms of IDs or classes (trac- prefix), rather than trying to cope with the existing structure.

[Christian Boos]

All the tickets for {20} from last year have probably been seen multiple times by now, yet are still to be triaged…

[Ryan J Ollos]

I took the suggestions from this ticket and prepared the changes in log:rjollos.git:t10841. Ethan, does it solve the issue you were encountering?

[Peter Suter]

Closely related to #11896.

[Ryan J Ollos]

Tentative plan is to just apply attachment:ticket_css_propertiestable_multiple_child_selectors.diff​, since it's similar to the change in [13662] and will get the job done for now. However, I haven't fully tested that patch yet.

[Ryan J Ollos]

There will be less risk to apply to trunk.

[Ryan J Ollos]

Proposed changes in log:rjollos.git:t10841.2.

[Ryan J Ollos]

Committed to trunk in [13754].