1

How do I display an unordered list in more than one column? I have an HTML unordered list(bullet-ed). I also have multiple columns. I wish to print the HTML document. The only browser that comes close job is FireFox. Goggle Chrome (v58) shows all columns but only shows bullets in the first column. IE (V11) ignores the COLUMNS style altogether.

FireFox seems to ignore the margins.

The following is a snippet of my HTML:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Home Movies</title>
    <style type="text/css" media="print">
        @page
        {
        margin: 2cm
        }
    </style>
    <style>
      body {height: 11}
      h1 {text-align:center}
      h3 {text-align:center}
      h4 {text-align:center}
      .slot {color: RED}
      .time {color: GREEN}
      .case {color: TURQUOISE}
      .disc {color: ORANGE}
      .hm   {color: DARKTEAL}
      .break { page-break-before: always; }
      .list {-webkit-columns: 50px 4;
             -moz-columns: 50px 4;
             columns: 50px 4
             float: left;
             position: relative;
             margin-right: 20px;
             font-family: Arial;
             font-size:x-small;
    </style>
  </head>
  <body>
    <header>
      <h1>Home Movies by Title</h1>
      <h3>1/Jun/2017</h3>
      <h4><span class="slot">[DVD Slot]</span> <span class="time">[Time]
        </span> <span class="case">{In Case}</span> <span class="disc">{On 
        Disc}
        </span> <span class="hm">(Hallmark Rating)</span></h4>
    </header>
<ul class="list">
John Bodoh
  • 11
  • 1

0 Answers0