Texto en columnas html5

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
    *{
        box-sizing:border-box;
        margin:0;
        padding:0;
    }  
    html{
        font-family: Verdana, Geneva, Tahoma, sans-serif;
    }
    #wrapper{
        width:80%;
        height:300px;
        margin-top:50px;
        margin-left:auto;
        margin-right:auto;
    }  
    .column-three{
        text-align: justify;
        column-count: 3;
        column-gap: 40px;
        column-rule: 2px solid tomato;

    }
    </style>
</head>
<body>
    <div id="wrapper">
        <div class="column-three">
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis voluptates atque ipsa, ea dolor debitis fugit esse neque obcaecati explicabo laboriosam commodi culpa earum iure facilis possimus necessitatibus nemo cum tempora cumque! Accusantium tempore odio, delectus quibusdam porro in voluptas voluptate a sapiente? Eligendi atque nemo enim rem nihil nostrum unde explicabo, maiores dolore, quam quis ipsam suscipit consectetur corrupti?</p>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quae officiis neque ab. Debitis, illo. Harum doloremque voluptas illo facere dolores! Aliquam, reiciendis vitae? Reprehenderit officiis minima vitae harum tempora veritatis cupiditate libero, atque ipsam ex ullam impedit. Adipisci consequuntur ex non. Libero asperiores eaque amet, suscipit officia quaerat exercitationem est illum quasi, quidem dolor unde, minima dolore quis. Numquam aperiam accusamus error blanditiis porro quisquam eius. Quae inventore molestias provident sed eum, quos quis harum quasi veritatis voluptates quia dolore.</p>
        </div>
    </div>
    
</body>
</html>