Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Propriedade order não esta funcionando de acordo

Com a propriedade "order=1;" o segundo filho não foi para frente do primeiro como demonstrado na aula, e sim para a ultima posição.

<html>
<head>
    <title>

    </title>
    <style type="text/css">
        .container{
            display: flex;
            align-items: center;
            justify-content: space-between;

        }
        .flexbox{

            background-color: black;
            padding: 35px;
            display: flex;
            flex-direction: column;
            margin-right: 10px;
            flex:1;

        }
        .box{
            padding: 15px;
            border:4px solid white;
            color: white;            
        }
        .flexbox:nth-child(2){
            flex:2;
            order: 1;
            -webkit-order: 1;
        }
    </style>
</head>
<body>
<div class="container">
    <div class="flexbox">
        <div class="box">
        <p>
            Não sou faixa preta cumpadi, sou preto inteiris, inteiris. Todo mundo vê os porris que eu tomo, mas ninguém vê os tombis que eu levo! Quem manda na minha terra sou euzis! Leite de capivaris, leite de mula manquis sem cabeça.
        </p>
        </div>        
    </div>
    <div class="flexbox">
        <div class="box">
        <p>
            Mussum Ipsum, cacilds vidis litro abertis. Quem manda na minha terra sou euzis! Admodum accumsan disputationi eu sit. Vide electram sadipscing et per. Quem num gosta di mé, boa gentis num é. Cevadis im ampola pa arma uma pindureta.Mussum Ipsum, cacilds vidis litro abertis. Quem manda na minha terra sou euzis! Admodum accumsan disputationi eu sit. Vide electram sadipscing et per. Quem num gosta di mé, boa gentis num é. Cevadis im ampola pa arma uma pindureta.
        </p>
        </div>        
    </div>
    <div class="flexbox">
        <div class="box">
        <p>
            Praesent vel viverra nisi. Mauris aliquet nunc non turpis scelerisque, eget. Em pé sem cair, deitado sem dormir, sentado sem cochilar e fazendo pose. Diuretics paradis num copo é motivis de denguis. Praesent malesuada urna nisi, quis volutpat erat hendrerit non. Nam vulputate dapibus.
        </p>
        </div>        
    </div>
</div>
</body>
</html>
1 resposta
solução!

Bom dia João,

Na verdade acho que foi apenas um erro na atividade, a propriedade order já é por padrão 1, então se você não definir a ordem, todos serão iguais e respeitarão a ordem que foram disponibilizados no HTML, para aparecer primeiro você tem que colocar um número menor que 1, e para aparecer depois você coloca um número maior que 1.

Espero ter ajudado.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software