Improved support for columns in HTML.

* Move as much as possible to the CSS in the template.
* Ensure that all the HTML-based templates (including epub)
  contain the CSS for columns.
* Columns default to 50% width unless they are given a width
  attribute.

Closes #4028.

8 files changed, 24 insertions, 24 deletions

diff --git a/test/command/1710.md b/test/command/1710.md
index 8a8b05889..d14f1217f 100644
--- a/test/command/1710.md
+++ b/test/command/1710.md
@@ -19,17 +19,17 @@ ok
 <section id="slide-one" class="slide level1">
 <h1>Slide one</h1>
 <div class="columns">
-<div class="column" style="width:40%;min-width:40%;vertical-align:top;">
+<div class="column" style="width:40%;">
 <ul>
 <li>a</li>
 <li>b</li>
 </ul>
-</div><div class="column" style="width:40%;min-width:40%;vertical-align:top;">
+</div><div class="column" style="width:40%;">
 <ul>
 <li>c</li>
 <li>d</li>
 </ul>
-</div><div class="column" style="width:10%;min-width:10%;vertical-align:top;">
+</div><div class="column" style="width:10%;">
 <p>ok</p>
 </div>
 </div>
diff --git a/test/lhs-test.html b/test/lhs-test.html
index a921c6a56..2939c95bb 100644
--- a/test/lhs-test.html
+++ b/test/lhs-test.html
@@ -7,9 +7,9 @@
   <title>lhs-test</title>
   <style type="text/css">
       code{white-space: pre-wrap;}
-      .smallcaps{font-variant: small-caps;}
-      .line-block{white-space: pre-line;}
-      .column{display: inline-block;}
+      span.smallcaps{font-variant: small-caps;}
+      div.line-block{white-space: pre-line;}
+      div.column{display: inline-block; vertical-align: top; width: 50%;}
   </style>
   <style type="text/css">
 div.sourceLine, a.sourceLine { display: inline-block; min-height: 1.25em; }
diff --git a/test/lhs-test.html+lhs b/test/lhs-test.html+lhs
index 8d27e6a58..7562a7d44 100644
--- a/test/lhs-test.html+lhs
+++ b/test/lhs-test.html+lhs
@@ -7,9 +7,9 @@
   <title>lhs-test</title>
   <style type="text/css">
       code{white-space: pre-wrap;}
-      .smallcaps{font-variant: small-caps;}
-      .line-block{white-space: pre-line;}
-      .column{display: inline-block;}
+      span.smallcaps{font-variant: small-caps;}
+      div.line-block{white-space: pre-line;}
+      div.column{display: inline-block; vertical-align: top; width: 50%;}
   </style>
   <style type="text/css">
 div.sourceLine, a.sourceLine { display: inline-block; min-height: 1.25em; }
diff --git a/test/s5-basic.html b/test/s5-basic.html
index bace22ebd..de4e19f73 100644
--- a/test/s5-basic.html
+++ b/test/s5-basic.html
@@ -12,9 +12,9 @@
   <title>My S5 Document</title>
   <style type="text/css">
       code{white-space: pre-wrap;}
-      .smallcaps{font-variant: small-caps;}
-      .line-block{white-space: pre-line;}
-      .column{display: inline-block;}
+      span.smallcaps{font-variant: small-caps;}
+      div.line-block{white-space: pre-line;}
+      div.column{display: inline-block; vertical-align: top; width: 50%;}
   </style>
   <!-- configuration parameters -->
   <meta name="defaultView" content="slideshow" />
diff --git a/test/s5-fancy.html b/test/s5-fancy.html
index 386ae6dbd..57ac6cac9 100644
--- a/test/s5-fancy.html
+++ b/test/s5-fancy.html
@@ -12,9 +12,9 @@
   <title>My S5 Document</title>
   <style type="text/css">
       code{white-space: pre-wrap;}
-      .smallcaps{font-variant: small-caps;}
-      .line-block{white-space: pre-line;}
-      .column{display: inline-block;}
+      span.smallcaps{font-variant: small-caps;}
+      div.line-block{white-space: pre-line;}
+      div.column{display: inline-block; vertical-align: top; width: 50%;}
   </style>
   <!-- configuration parameters -->
   <meta name="defaultView" content="slideshow" />
diff --git a/test/s5-inserts.html b/test/s5-inserts.html
index a3c3a7886..f21365c64 100644
--- a/test/s5-inserts.html
+++ b/test/s5-inserts.html
@@ -10,9 +10,9 @@
   <title>My S5 Document</title>
   <style type="text/css">
       code{white-space: pre-wrap;}
-      .smallcaps{font-variant: small-caps;}
-      .line-block{white-space: pre-line;}
-      .column{display: inline-block;}
+      span.smallcaps{font-variant: small-caps;}
+      div.line-block{white-space: pre-line;}
+      div.column{display: inline-block; vertical-align: top; width: 50%;}
   </style>
   <link rel="stylesheet" href="main.css" type="text/css" />
   STUFF INSERTED
diff --git a/test/writer.html4 b/test/writer.html4
index 51751170a..c002311b3 100644
--- a/test/writer.html4
+++ b/test/writer.html4
@@ -10,9 +10,9 @@
   <title>Pandoc Test Suite</title>
   <style type="text/css">
       code{white-space: pre-wrap;}
-      .smallcaps{font-variant: small-caps;}
-      .line-block{white-space: pre-line;}
-      .column{display: inline-block;}
+      span.smallcaps{font-variant: small-caps;}
+      div.line-block{white-space: pre-line;}
+      div.column{display: inline-block; vertical-align: top; width: 50%;}
   </style>
 </head>
 <body>
diff --git a/test/writer.html5 b/test/writer.html5
index db2317be1..e8e10f995 100644
--- a/test/writer.html5
+++ b/test/writer.html5
@@ -10,9 +10,9 @@
   <title>Pandoc Test Suite</title>
   <style type="text/css">
       code{white-space: pre-wrap;}
-      .smallcaps{font-variant: small-caps;}
-      .line-block{white-space: pre-line;}
-      .column{display: inline-block;}
+      span.smallcaps{font-variant: small-caps;}
+      div.line-block{white-space: pre-line;}
+      div.column{display: inline-block; vertical-align: top; width: 50%;}
   </style>
   <!--[if lt IE 9]>
     <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv-printshiv.min.js"></script>