Pessoal, bom dia
Alguém pode me auxilar qual o jeito certo de alinhar um texto com a imagem Já tentei de todas as formas que eu sei e não dá certo
http://prntscr.com/qnjvos
<body>
<header>
<div>
<img src="img/logo-ivana.png" alt="" class="logo-ivana">
<nav>
<ul>
<li><a href="index.html">Inicio</a></li>
<li><a href="sobre.html">Sobre</a></li>
<li><a href="calculo_pacientes.html">Calculo IMC</a></li>
<li><a href="contato.html">Contato</a></li>
</ul>
</nav>
<h1><img src="img/cropped-bannerivana-1.png" width="100%" height="2%" alt=""></h1>
</div>
</header>
nav {
display: inline;
padding: 25px;
}
nav a {
text-transform: uppercase;
}
nav li {
display: inline;
position: relative;
}
ul {
margin-left: 50%;
}
.logo-ivana {
width: 120px;
display: inline-block;
margin: 10px 0px 0px 150px;
padding-top: 5px;
}
section h2 {
font-size: 25px;
font-weight: bold;
color: blueviolet;
margin: 0px;
text-align: center;
text-transform: uppercase;
}
.descritivo-principal {
font-size: 20px;
text-align: justify;
margin: 40px 85px 0px;
text-indent: 50px;
color: darkgray;
}
.img-ivana {
margin: 10px 80px;
width: 210px;
display: inline-block;
}
.principal {
display: inline;
position: absolute;
margin: 10px 10px 10px;
padding: 10px;
}