Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

erro CSS classe imagem-beneficios não reduz a largura da imagem

Boa noite estou com dificuldade na correção de 2 erros contidos no arquivo Style. CSS . A primeira está relacionada na classe .imagem-beneficios simplesmente não reconhece a existência da mesma e a largura da imagem não possui 60% e sim a largura integral . O segundo erro nem imagino o que seja, olhei varias vezes mas sem sucesso... Podem ajudar?

insira 
body{
    font-family: 'Montserrat', sans-serif;
}

header{
    background: #bbbbbb;
    padding: 20px 0;
}
.caixa{
    position: relative;
    width: 940px;
    margin:0 auto;
}
nav{
    position: absolute;
    top: 110px;
    right: 0;

}
nav li{
    display: inline;
    margin-left:0 0 0 15px ;
}

nav a{
    text-transform: uppercase;
    color:#000000;
    font-weight: bold;
    font-size: 22px;
    text-decoration: none;
}
nav a:hover{
    color:#C78C19;
    text-decoration:underline;
}

.produtos{
    width: 940px;
    margin:0 auto;
    padding:50px 0;

}

.produtos li{

    display: inline-block;
    text-align: center;
    width: 30%;
    vertical-align: top;
    margin: 0 1.5px;
    padding: 30px 20px;
    box-sizing: border-box;
    border-color: 000000;
    border-width: 2px;
    border-style: solid;
    border-radius: 15px;

}
.produtos li:hover{
    border-color:#C78C19;

}
.produtos li:active{
    border-color: #088C19;
}
.produtos li:hover h2{
    font-size: 40px;
}
.produtos h2{
    font-size: 30px;
    font-weight:bold;
}
.produto-descricao{
    font-size: 22px;
}
.produto-preco{
    font-size: 22px;
    font-weight: bold;
    margin:10px 0 0;

}
footer{
    text-align: center;
    background:url("bg.jpg");
    padding:40px 0;
}
.copyright{
    color:#FFFFFF;
    font-size: 13px;
    margin:20px;
}
main{
    width: 940px;
    margin: 0 auto;
}
form{
    margin:40px 0;
}
form label, form legend{
    display: block;
    font-size: 20px;
    margin: 0  0 10px;

}

.input-padrao{
    display: block;
    margin:0 0 20px;
    padding: 10px 25px;
    width: 50%;

}
.checkbox{
    margin: 20px 0;
}
.enviar{
    width: 40%;
    padding: 15px 0;
    background-color: orange;
    color: white;
    font-weight: bold;
    font-size: 20px;
    border:none;
    border-radius: 5px;
    transition: 1s all;
    cursor: pointer;

}
.enviar:hover{
    background-color: darkorange;
    transform: scale(1.20);
    transform: rotate(70deg);
}
table{
    margin: 20px 0 40px;
}

thead{
    background: #555555;
    color:white;
    font-weight: bold;
}
td,th{
    border: 1px solid #000000;
    padding: 8px 15px;

}
/* css da pagina inicial */
.banner{
width: 100%;
}
.titulo-principal{
    text-align: center;
    font-size: 2em;
    margin: 0 0 1em;
    clear: left;
    /* devido ao uso  do float na classe utensilios os demais elementos abaixo dele
    são afetados assim devo usar o clear para que  flutuação não atrapalhe o html*/

}
.principal p {
    margin:0 0 1em;

}
.principal strong{
    font-weight: bold;
}
.principal em {
    font-style: italic;
}
.utensilios{
    width: 120px; 
    float:left;
    margin: 0 20px 20px 0;
}
.beneficios{
    padding: 3em 0;
}
.conteudo-beneficios{
    width: 640px;
    margin: 0 auto;
}
.lista-beneficios{
    width: 40%;
    display: inline-block;
    vertical-align: top;

.imagem-beneficios{
    width: 60%;
}

.itens{
    line-height: 1.5;
}
.itens:first-child{
    font-weight: bold;

}

.mapa{
    padding: 3em 0;

}
.mapa p{
    margin: 0 0 2em;
    text-align: center;
}
.video{
    width:560;
    margin: 2em auto;
}seu código aqui
4 respostas

Olá Wagner, tudo certo?

Qual seria o segundo erro?

Já o width de 60% eu também estava com esse erro. Eu corrigi ele desta maneira, não sei se vai funcionar com você:

.imagem-beneficios{
    width: 59%;
}

Espero ter ajudado, bons estudos!

Boa noite Diego rapaz o segundo eu nem sei por que no VisualCode só informa que existem dois erros ,um é fácil de identificar por que coloração não muda da classe fica totalmente branca.O segundo erro não achei tentei ver se pelo inspecionar do navegador pudesse me dar alguma pista...mas até agora nada.

Agradeço a sua ajuda vou tentar coloca 59 entretanto estava funcionando simplesmente não sei explicar

Bo anoite Diego, pelo que eu pude e avaliar está faltando o fechamento de chaves, mas ela esta la conforme o codigo acima O segundo erro acredito que seja decorrente do primeiro

erros descritos pelo VSCode } expected css(css-rcurlyexpected) [189,1]

at- rule or selector expected Css(css-ruleorselectorexpected)[191,1]

solução!

Achei o erro , grato garoto pelo apoio estava faltando o a chave antes de outra classe que estava acima da classe .imagem beneficio

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