将divs放在bootstrap中的正确位置

Question

我想将红色矩形放置在this image中的黄色矩形中，但是我不知道该怎么做。 HTML（我正在使用引导程序）：

<div class="col-md-3"></div>
<div id="pageContent" class="alert alert-primary col-12 col-sm-8 col-md-9">

</div>

这是我的CSS：

#pageContent {
margin: auto;
margin-top: 8%;
height: 500px;

}

能帮我吗？ ：p