Bootstrap 4行与其父级重叠

Question

我正在试图弄清楚为什么行与其父级重叠。

摆弄准备好的问题： https://jsfiddle.net/asmar/raxr3apg/

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">
<div class="newWrap">
    <span class="h4">Plán akcí na květen <span class="font-weight-light">(02.05.2018)</span></span>
    <div class="row newDescription">
        <div class="col-4 newImgWrap">
            <img src="https://images.pexels.com/photos/956981/milky-way-starry-sky-night-sky-star-956981.jpeg?auto=compress&cs=tinysrgb&h=300&w=300">
        </div>
        <div class="col-8">

        </div>
    </div>
</div>

这在我的环境中引起了这种情况： https://i.stack.imgur.com/Yx3EJ.png

提前感谢您的解释。