Boa noite!
Estou tentando colocar as duas divs lado a lado, porém não consigo usando 100% da largura.
Quando diminuo uma div um pouco funciona, mas queria entender do motivo de não poder usar os 100% para não cometer erros futuros.
<div class="caixa-main">
<div class="abertura">
<h2>Compramos seu precatório</h2>
<h3>Federal, Estadual ou Munucipal</h3>
<p>Seu precatório pode te ajudar nesse momento incerto e nós estamos aqui para mostrar o caminho.</p>
<p>Estamos à mais de 10 anos no mercado ajudando pessoas a tranformar a promessa do precatório em dinheiro real.</p>
<p>Trabalhamos com o pagamento na hora e à vista, com a transparência acima de tudo.</p>
<img class="imagem-dividida" alt="Imagem de uma planta em um vaso de dinheiro" src="abertura.jpg">
</div> <!--abertura-->
<div class="formulario">
<h2>Consulte o valor do seu precatório</h2>
<label for="nome">Nome</label>
<input id="nome" type="text" required placeholder="Seu nome completo" class="input-padrao">
<label for="email">Email</label>
<input id="email" type="email" required placeholder="email@gmail.com.br" class="input-padrao">
<label for="telefone">Telefone</label>
<input id="telefone" type="tel" required placeholder="(XX) XXXXX-XXXX" class="input-padrao">
<label for="mensagem">Deixe a sua dúvida ou observação aqui</label>
<textarea id="mensagem" type="text" rows="5" class="input-padrao"></textarea>
<fieldset>
<legend>Qual horário prefere ser atendido?</legend>
<select>
<option>Manhã</option>
<option>Tarde</option>
<option>Noite</option>
</select>
</fieldset>
<label for="whatsapp">Gostaria de receber nosso contato pelo Whatsapp?</label>
<input id="whatsapp" type="checkbox" checked>
<input class="enviar" type="submit" value="Receba uma proposta">
</div> <!--formulario-->
</div> <!--caixa-->
.caixa-main {
width: 960px;
margin: 0 auto;
position: relative;
background: #CCCCCC;
}
.abertura{
width: 40%;
display: inline-block;
text-align: center;
}
.formulario {
width: 60%;
display: inline-block;
text-align: center;
}