Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
5
respostas

Escrevi o mesmo codigo que o professor e não deu certo.

Referente ao curso Bootstrap: criação de uma single-page responsiva, no capítulo Começando a implementar o site seguindo o layout e atividade Fazendo a seção Sobre Nós

por Raul Matheus Pinheiro da Silva
| 176.6k xp | 265 posts

Meu layout que fui escrevendo de acordo com as aulas de Bootstrap não estão funcionando. Além disso, quando coloco a classe container, a configuração não da o padding necessário e nem o toggle está sendo ativado. O que devo fazer? Algum erro que não estou conseguindo enxergar?? Agradeço quem puder ajudar.

Sobre Nós 

    <img class="img-responsive" src="../curso_alura/assets/img/empresa.jpg" >

    <h2 data-toggle="collapse" data-target="p" >Desde 1935</h2>

    <p class="collapse in">A Casa Fina Arquitetura está no mercado desde</p>

    <h2 data-toggle="collapse" data-target="p" >Desde 1900</h2>

    <p class="collapse">A Casa Fina Arquitetura está no mercado desde</p>

    <h2 data-toggle="collapse" data-target="p">Desde 1935</h2>

    <p class="collapse in">A Casa Fina Arquitetura está no mercado desde</p>
    <!-- colocamos a classe colapse do bootstrap JS para esconder os paragrafos -->
</div>
5 respostas
por Laís Cavalcanti
| 2577.8k xp | 4815 posts
Instrutor

Oi, Raul, tudo bem?

Você utilizou o código que está na descrição da aula: 

<h2>Sobre Nós</h2>
<img class="img-responsive" src="img/empresa.jpg">

    <h2 data-toggle="collapse" data-target="#primeiro-paragrafo">Desde 1935</h2>
    <p id="primeiro-paragrafo" class="collapse in">A TopCasa Fina Arquitetura está no mercado desde... </p>

    <h2 data-toggle="collapse" data-target="#segundo-paragrafo">Desde 1935</h2>
    <p id="segundo-paragrafo" class="collapse">A TopCasa Fina Arquitetura está no mercado desde... </p>

    <h2 data-toggle="collapse" data-target="#terceiro-paragrafo">Desde 1935</h2>
    <p id="terceiro-paragrafo" class="collapse">A TopCasa Fina Arquitetura está no mercado desde... </p>
`

E seguiu os passsos de adicionar o script do jquery? Se não solucionar, coloca aqui os seus códigos completos para podermos ver melhor o que está acontecendo :}

por Raul Matheus Pinheiro da Silva
| 176.6k xp | 265 posts

Fiz o teste com o código que me mandou e continua sem dar certo. O parágrafo não some nem aparece quando clico. A imagem continua sem formatação. Está complicado de achar o erro.

por Jonathan Reis dos Santos
| 80.3k xp | 4 posts
Front-end Engineer Senior

Olá Raul, você configurou o javascript do bootstrap na página html?

segue o link da documentação do bootstrap (em português), ele te mostra uma estrutura da página com os imports dos arquivos javascripts que precisam para executar algumas interações

https://getbootstrap.com.br/docs/4.1/getting-started/introduction/

Criei um teste do seu código com os imports necessários e rodou: https://jsfiddle.net/2h4603ac/3/

por Raul Matheus Pinheiro da Silva
| 176.6k xp | 265 posts

Não importei, pois no arquivo Html do professor não teve o import do JS e mesmo assim está funcionando. Vou tentar com o que me mandou. Mas deve ser esse o erro mesmo. Muito Obrigado.

Só mais uma questão, você importa no fim do

ou no ?
solução!
por Jonathan Reis dos Santos
| 80.3k xp | 4 posts
Front-end Engineer Senior

Opa Raul se for javascript sempre importo no final do arquivo:

    <script src="arquivo.js"></script>
</body>

Dessa forma o meu javascript não impacta no render inicial da página no browser, você pode ler mais sobre isso aqui: https://pt.stackoverflow.com/questions/1109/onde-devo-colocar-um-c%C3%B3digo-javascript-em-um-documento-html

no caso dos arquivos css sempre importo no final do head:

    <link rel="stylesheet" type="text/css" href="arquivo.css">
</head>