<h1>Centralizar na vertical com CSS</h1> <section class="text"> <p> Lorem Ipsum, giving information!</p> </section> <section class="image"> <img src="http://placehold.it/70x70" /> </section> <section class="div"> <div class="content-div"></div> </section>
h1 { text-align:center; } .text p { position: relative; top: 50%; transform: translateY(-50%); } .image img { position: relative; top: 50%; transform: translateY(-50%); } .div .content-div { position: relative; top: 50%; transform: translateY(-50%); } .content-div{ width: 50px; height: 50px; background:#f60; } section { display: block; max-width: 500px; background: #433669; margin: 0 auto 1em; height: 140px; border-radius: .5em; color: white; padding: 0 5px; }