2
respostas

lista não muda de lugar

No meu codigo,os itens da lista nao vão para o topo.

</head>
<body>
    <img id="banner" src="barbearia.jpg">
    <div class="principal">
        <h1>Sobre a Barbearia Alura</h1>
            <p >Localizada no coração da cidade a <strong>Barbearia Alura</strong> traz para o mercado o que há de melhor para o seu cabelo e barba. Fundada em 2019, a Barbearia Alura já é destaque na cidade e conquista novos clientes a cada dia.</p>

            <p id="missao"><em>Nossa missão é:<strong>"Proporcionar auto-estima e qualidade de vida aos clientes"</em></strong></em></p>

            <p >Oferecemos profissionais experientes e antenados às mudanças no mundo da moda. O atendimento possui padrão de excelência e agilidade, garantindo qualidade e satisfação dos nossos clientes.
            </p>
    </div>

        <h2>Benefícios</h2>

        <div class="beneficios">
            <ul>
                <li class="itens">Atendimento aos clientes</li>
                <li class="itens">Espaço diferenciado</li>
                <li class="itens">Localização</li>
                <li class="itens">Profissionais qualificados</li>
            </ul>
    </div>
    <img  src="corte.jpg" class="imagem2">
</body>

arquivo de estilo ul { display: inline-block; vertical-align: top; width: 20%; margin-right: 15%; }

2 respostas

Olá, Poliana, experimente substituir ul por .beneficios no arquivo css, assim:

.beneficios { 
    display: inline-block; 
    vertical-align: top; 
    width: 20%; 
    margin-right: 15%; 
}

Isso, porque beneficios é o nome da classe que identifica o elemento pai da lista.

Espero ter ajudado. Bons estudos!

Olá Poliana, tudo bem? Estava com o mesmo problema, conseguir resolver colocando a imagem dentro da divisão `

    <h2>Benefícios</h2>

    <div class="beneficios">
        <ul>
            <li class="itens">Atendimento aos clientes</li>
            <li class="itens">Espaço diferenciado</li>
            <li class="itens">Localização</li>
            <li class="itens">Profissionais qualificados</li>
        </ul>
        <img  src="corte.jpg" class="imagem2">
</div>

`

Dessa forma, espero ter ajudado, obrigado!