Skip to main content
4 de 4
removeu 50 caracteres do conteúdo
Diego Souza
  • 16,7mil
  • 4
  • 36
  • 104

Eu tirei seu CSS inline do HTML. Nunca mais faça isso a não ser que seja assinatura de e-mail. Enfim, não vem ao caso.

Nos elementos abaixo distribuí por meio de display:inline-block e usei a propriedade line-height com vertical-align:middle deixando assim a imagem centralizada na DIV e também o HR.

#bola {
  display: inline-block;
  width: 15%;
  font-size: 22px;
  font-weight: bolder;
}
#bola2 {
  display: inline-block;
  margin-left: 20px;
  width: 70%;
  line-height: 60px;
}
#bola2 img {
  vertical-align: middle;
}
hr {
  vertical-align: middle;
  margin-left: -7px;
  background-color: #D19D1C;
  height: 3px;
  border: none;
  width: 70%;
  display: inline-block;
}
<div id="bola" class="alinhar">
  <h4>Bibliotecas</h4>
</div>
<div id="bola2" class="alinhar">
  <img src="http://culturalis.pt/wp-content/uploads/2015/06/circun.png" alt="curva" />
  <hr></hr>
</div>

Diego Souza
  • 16,7mil
  • 4
  • 36
  • 104