<html>
<head>
<style>
body
{
flow: v-flow;
border: 1px solid blue;
}
ul
{
padding : 0;
margin : 0;
margin-left : .7em;
width : 200px;
flow : h-flow;
border : 1px solid red;
}
li
{
width : max-intrinsic;
display : block;
padding : 1px;
}
</style>
</head>
<body>
<ul>list
<li>Lorem</li>
<li>ipsum</li>
<li>dolor</li>
<li>sit</li>
<li>amet,</li>
<li>consectetur</li>
<li>adipisicing</li>
<li>elit,</li>
<li>sed</li>
<li>do</li>
<li>eiusmod</li>
</ul>
<ul>
<li>tempor</li>
<li>incididunt</li>
<li>ut</li>
<li>labore</li>
<li>et</li>
<li>dolore</li>
<li>magna</li>
<li>aliqua.</li>
</ul>
<ul>
<li>Ut</li>
<li>enim</li>
<li>ad</li>
<li>minim</li>
<li>veniam,</li>
<li>quis</li>
<li>nostrud</li>
<li>exercitation</li>
<li>ullamco</li>
</ul>
<ul>
<li>laboris</li>
<li>nisi</li>
<li>ut</li>
<li>aliquip</li>
<li>ex</li>
<li>ea</li>
<li>commodo</li>
<li>consequat.</li>
</ul>
</body>
</html> |
