minha imagem "beneficio" nao fica do lado direito, mesmo eu fazendo igual o video

Olá, Iago.

Tudo bem?

Eu testei o seu CSS com o meu HTML e a imagem ficou certa, não sei te falar o que pode estar causando isso porque não tenho o seu cógido HTML. Poderia por gentileza compartilhar os códigos completos dos arquivos HTML e CSS?

Você pode tentar resolver diminuindo a largura da imagem para width: 40%; :

.imagembeneficio{
    width: 50%;
}

Valeu Iago.

Olá Iago, então no código padrão a imagem fica abaixo por conta que a tag ul ocupa a linha toda, então nela deve estar o problema, a imagem em si ela só tem formatação de tamanaho que é o width: 50% No seu código css que postou antes do ul tem uma { sobrando não tem?!

Eu estava com esse mesmo problema, mas não parei enquanto não conseguia resolver, pra resolver eu mudei as propriedades da tag "UL" pra tag "DIV" e comigo funcionou

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

A tag "UL" ficou sem nada então eu só apaguei

Olá, pessoal!

Estou com o mesmo problema, segui a dica do Elias de colocar na classe benefícios e diminuiu o tamanho da imagem, porém não consigo justificar à direita. Alguém consegue me ajudar? Tentei adicionar padding na classe imgbeneficios e não rolou tbm:

.beneficios { background: white; padding: 50px; display: inline-block; vertical-align: top; width: 35%; margin-right: 15%; }

.imgbeneficios { width: 50%; }

body{

}

#banner{ width: 100%; }

.principal{ background: #CCCCCC; padding: 30px; }

.titulo-principal{ padding-left: 20px; }

.titulo-centralizado{ text-align: Center; }

p{ text-align: Center; }

#missao{ font-size: 20px; }

em strong{ color: #FF0000; }

.itens { font-style: italic; }

.beneficios{ background: #FFFFFF; padding: 20px;

}

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

.imagembeneficio{ width: 50%; }

Testei oq o Elias falou mas ficou como a Paola disse

body{

}

#banner{ width: 100%; }

.principal{ background: #CCCCCC; padding: 30px; }

.titulo-principal{ padding-left: 20px; }

.titulo-centralizado{ text-align: Center; }

p{ text-align: Center; }

#missao{ font-size: 20px; }

em strong{ color: #FF0000; }

.itens { font-style: italic; }

.beneficios{ background: #FFFFFF; padding: 20px;

}

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

.imagembeneficio{ width: 50%; }

Testei oq o Elias falou mas ficou como a Paola disse