Update HOWTO.md

HOWTO.md

@@ -1,22 +1,24 @@
 # The Fu to edit the transition requirements 
 
-HTML elements are displayed or not based on the user selection.
+HTML elements are displayed (or not) based on the user selection.
 
 When an option is selected, it updates the URL of the document with a new set of parameters. Those parameters are reflected within the HTML document using the @data attributes.
 
 So far, we have the following data attributes (each matching a URL parameter):
 
-1. data-profile for a |-separated list of profile
-2. data-rec for a |-separated list of REC paths
-3. data-cr for a |-separated list of CR paths
-3. data-informativeOnly for a |-separated list of FPWD and WD paths
-4. data-returning for a |-separated list of FPWD and WD paths
-5. data-notehistory for a |-separated list of first [working|interest] group note paths
-7. data-echidna for automatic publishing
+1. `data-profile` for a |-separated list of profile
+2. `data-rec` for a |-separated list of REC paths
+3. `data-cr` for a |-separated list of CR paths
+3. `data-informativeOnly` for a |-separated list of FPWD and WD paths
+4. `data-returning` for a |-separated list of FPWD and WD paths
+5. `data-notehistory` for a |-separated list of first [working|interest] group note paths
+7. `data-echidna` for automatic publishing
 
-If no data attributes are present, the element will get displayed for all possible states within the scope of the parent element. For example, to display an element for all types of Recommendations, use data-profile="rec" and don't use the data-rec attribute on that element.'
+If no data attributes are present, the element will get displayed for all possible states *within the scope of the parent element*. For example, to display an element for all types of Recommendations, use `data-profile="REC"` and don't use the `data-rec` attribute on that element.
 
-If data attributes are used, one of them must be @data-profile, otherwise the other data attributes will be ignored.
+The data attributes may be combined but, if data attributes are used, one of them must be `data-profile`, otherwise the other data attributes will be ignored.
+
+If you may use multiple values for each attribute, separated by `|`. For example, to display an element for all types of Recommendations and Candidate Recommendations, use `data-profile="REC|CR"`.
 
 e.g.
 ```
@@ -28,10 +30,12 @@ e.g.
 </div>
 ```
 
-* d1 and e1 will get displayed if the user selected any of the Candidate Recommendation options (the URL contains the parameter profile=CR ).
-* e2 will get displayed only for snapshots, including the first one.
-* e3 will get displayed only for CR drafts.
-* e4 will never get displayed since the scope of its parent element is CR (and a document can't be a CR and a REC at the same time).
+If the user selected any of the Candidate Recommendation options (the URL contains the parameter `profile=CR` ):
+
+* `d1` and `e1` will get displayed.
+* `e2` will get displayed only for snapshots, including the first one.
+* `e3` will get displayed only for CR drafts.
+* `e4` will never get displayed since the scope of its parent element is CR (and a document can't be a CR and a REC at the same time).
 
 To find the possible values for each data attribute, look at the HTML option and input HTML elements in [the document](https://github.com/w3c/transitions/blob/main/index.html#L269). Or, if you're looking for a particular document transition, use the form to select and see the values of the URL parameters.