Я пытаюсь центрировать 3 столбца, это займет всего 9 столбцов bootstrap, но не 12 столбцов, поэтому мне нужно центрировать этот тип столбца bootstrap 4. посмотрите фрагмент, в чем я не прав. Я пытаюсь использовать justify-content-center, но он не полностью центрируется на мобильном устройстве, если я использую
justify-content-center
на см устройстве, последний ребенок не хочет центрироваться, но в левой части.
<!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>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<style>
.border{
border: 1px solid red!important;
}
</style>
</head>
<body class="p-0 m-0">
<div class="container">
<div class="row justify-content-sm-start justify-content-md-center">
<div class="col-sm-5 col-md-3 border">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Nostrum dolores, veritatis tempore nihil explicabo mollitia doloribus laborum! Cupiditate, saepe. Commodi, mollitia? Sit quia magnam commodi inventore impedit quam nam voluptate est odio, alias unde a doloribus aliquid beatae eaque recusandae corrupti delectus reprehenderit ipsa dolorum hic. Labore possimus eos amet. Officia porro vel, veritatis minus natus tempore ratione quo nostrum, adipisci laboriosam temporibus qui. Architecto possimus laboriosam explicabo iusto! Minus iusto amet aperiam voluptatum libero placeat vero, molestias dolorem vitae eius doloremque optio? Ea blanditiis distinctio similique labore odio culpa, quis nobis veniam sapiente sed. Illum labore saepe doloremque sapiente.</div>
<div class="col-sm-5 col-md-3 border ">Et laborum libero dignissimos ea molestias, quae rerum veritatis harum quidem soluta! Perferendis cumque minima modi enim ducimus exercitationem accusantium facilis dolore corrupti ab, esse autem. Illo inventore tenetur aut recusandae nostrum dolorum dolore doloribus nihil cupiditate. Voluptas ex commodi expedita atque sint obcaecati iure explicabo ipsam quo consequatur laudantium officia autem recusandae sapiente quae excepturi a culpa sunt, ratione quis tenetur vitae odio corrupti. Perspiciatis blanditiis, debitis eaque sequi porro hic minus ex adipisci iste ad accusamus aut atque eius mollitia error ducimus labore praesentium sed dolorem? Incidunt eaque ex eum unde ducimus et libero repudiandae aliquid porro nesciunt.</div>
<div class="col-sm-5 col-md-3 border">Laboriosam itaque labore iusto quidem ipsum quae et ipsam alias incidunt cumque, nobis quaerat corporis inventore! Quibusdam et ipsam quam pariatur unde. Modi aut rerum iure exercitationem fugit similique tenetur maxime saepe, vitae laudantium minus ad repudiandae cumque ea dolorum eaque distinctio autem provident officiis facilis, atque veritatis reiciendis animi. Consequatur quam eveniet doloremque sequi inventore, explicabo excepturi beatae facilis porro quibusdam suscipit. Id fugit fugiat vel excepturi autem quae, recusandae provident ipsum, praesentium ex facilis aspernatur amet dolore dolorum? Dicta quod pariatur autem nulla explicabo corporis sunt necessitatibus ad natus rerum suscipit, velit sequi maiores quam? Culpa, quisquam odit.</div>
</div>
</div>
</body>
</html>