Arguments in HTML

This post is not about arguments that occur on the internet, but about how to display philosophical/logical arguments in standard form on the internet. To put an argument in standard form:

  1. Write each premise on a separate, numbered line,
  2. Draw a line underneath the last premise, and
  3. Write the conclusion underneath the line.

It’s easy enough to produce an ordered list in HTML, but then the conclusion is numbered, which makes it look like another premise. This can be fixed with a trick in CSS, just add something like this to your stylesheet:

.list-arg li:last-child {
list-style: none
}

The HTML in the document looks like this:

<ol class="list-arg">
1. First premise
2. <u>Second premise</u>
3. Conclusion
</ol>

As I was writing this post, I realized that I couldn’t add custom CSS to this WordPress.com blog without upgrading at a significant cost.

I spent two days toying with moving back to a static site or to the Ghost blogging platform. As I was experimenting with a self-hosted Ghost blog, it struck me that this might be incredibly easy to do in Markdown with something like this:

1. First premise
2. <u>Second premise</u>  
Conclusion

The thought was that putting two spaces after the last premise would signal a line break and remove the paragraph formatting. This worked nice in the Markdown previewer that I use on my computer, but WordPress produced this:

  1. First premise
  2. <u>Second premise</u>
    Conclusion

The indention was perfect, but no underlining. So, I went back to experimenting with HTML. Maybe I could take all of the list markers out and put the numbers in myself, with a "therefore" symbol for the conclusion.

<ol style="list-style:none;">
<li>1. First premise</li>
<li>2. <u>Second premise</u></li>
<li>∴ Conclusion</li>
</ol>

That produced this:

  1. 1. First premise
  2. 2. Second premise
  3. ∴ Conclusion

Finally, I wondered if I could insert the list-style attribute in the final list item:

<ol>
 	<li>First premise</li>
 	<li><u>Second premise</u></li>
 	<li style="list-style:none;">Conclusion</li>
</ol>

That gave me this, which was what I was after in the first place. It turns out that I really didn’t need to add anything to CSS at all.

  1. First premise
  2. Second premise
  3. Conclusion

Sometimes, the last premise is significantly shorter than the others, and the underline doesn’t look quite right. For example,

  1. P ⊃ Q
  2. P
  3. Q

That can be fixed with some non-breaking spaces. It looks ugly, but does take care of the problem.

<ol>
<li>P ⊃ Q</li>
<li><u>P &nbsp; &nbsp; &nbsp; &nbsp;</u></li>
<li style="list-style:none;">Q</li>
</ol>

That produces

  1. P ⊃ Q
  2. P        
  3. Q

Now, in writing this, I discovered that the new editor can’t handle footnotes. It turns out that there is always something.