1

I have three nested DIV elements. When I insert margin-top into the inside div all others receive the effect.

I need the inside div to have a margin-top relative to the outside div and not the whole block.

I created an example in codepen. I have one div, two div and three div.

Notice that I put the margin-top in div three, but all divs receive the effect.

Does anyone know the reason?

<div class="um">

            <div class="dois">

                <div class="tres" style="margin-top: 50px;">

                        conteudo

                </div>

            </div>

</div>

example codepen

Renato Souza de Oliveira
  • 4,236
  • 4
  • 20
  • 31

2 Answers2

2

use padding-top instead of margin-top.

<div class="um">
            <div class="dois">
                <div class="tres" style="padding-top: 50px;">
                        conteudo
                </div>
            </div>
</div>
Ngoc Hung Long Nguyen
  • 21
  • 3
2

default value tag div is display:block, add css on um class display:flex

MaqRiki
  • 46
  • 3