Vertical-Content-Example

by scurrilus

HTML

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
rel="stylesheet"/>

<div class="d-flex align-items-center justify-content-center container">
  <img src="https://dummyimage.com/600x400/green/fff">
  <div><p>
  I am in Center
  </p><p>
  I am in Center
  </p></div>
</div>

CSS

.container {
    height: auto;
    width: 100%;
    background-color: blueviolet;
}

.container > div {
  background-color: white;
  padding: 1rem;
  margin-left: -20px;
}