Fix Table Cellspacing for Custom Wiki Fields within a Trac Ticket

[Kristen]

When adding a table to a custom wiki field in a trac ticket, the spacing between cells appears uneven as more columns are created.

This is different when adding a table to the trac ticket's description textbox.

Example markup that demonstrates the issue:

||=Column1=||=Column2=||=Column3=||

This was discussed in ​gdiscussion:trac-users:VUOJFTRQtHw.

[Peter Suter]

It seems the CSS rules for #ticket table.properties tr, ... td and ... th should be more specific and only apply to rows and cells of that table (instead of all contained tables), e.g. #ticket table.properties > tbody > tr:

trac/htdocs/css/ticket.css

@@ -88 +88 @@
  table-layout: fixed;
  width: 100%;
 }
-#ticket table.properties tr { border-bottom: 1px dotted #eed }
-#ticket table.properties td, #ticket table.properties th {
+#ticket table.properties > tbody > tr { border-bottom: 1px dotted #eed }
+#ticket table.properties > tbody > tr > td, #ticket table.properties > tbody > tr > th {
  font-size: 80%;
  padding: .5em 1em;
  vertical-align: top;
 }
-#ticket table.properties th {
+#ticket table.properties > tbody > tr > th {
  color: #663;
  font-weight: normal;
  text-align: left;
  width: 20%;
 }
-#ticket table.properties th.missing { color: #d3d398; }
-#ticket table.properties td { width: 30% }
-#ticket table.properties td p:first-child { margin-top: 0 }
-#ticket table.properties td p:last-child { margin-bottom: 0 }
+#ticket table.properties > tbody > tr > th.missing { color: #d3d398; }
+#ticket table.properties > tbody > tr > td { width: 30% }
+#ticket table.properties > tbody > tr > td p:first-child { margin-top: 0 }
+#ticket table.properties > tbody > tr > td p:last-child { margin-bottom: 0 }
 #ticket table.properties .description { border-top: 1px solid #dd9 }
 
 #ticket .description h3 {

[Ryan J Ollos]

Might be a duplicate of #10841, or at least closely related.

[Peter Suter]

Replying to rjollos:

Might be a duplicate of #10841, or at least closely related.

Good point! It seems this ticket is about the ticket property view, while #10841 is about the same issue in the ticket property editing form.

It would certainly make sense to use the same approach in both cases. (Either > selectors, or new classes on tr, td, th. I don't know which approach is preferable. ​Writing efficient CSS in 2000 seems to have required avoiding > selectors, but apparently ​CSS Selector Performance has changed! (For the better) and now "authors should not need to worry about optimizing selectors".)

[Ryan J Ollos]

The > selectors result in more concise and readable CSS and HTML markup, so I'd favor that change if performance is not an issue.

[Ryan J Ollos]

I tested and the changes look good to me. I'll push log:rjollos.git:t11896-table-cellspacing-fix at the start of milestone:1.0.4 if there is no additional feedback.

[Ryan J Ollos]

Committed to 1.0-stable in [13662:13663], merged to trunk in [13664:13665].