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

bootstrap sem espaçamento abaixo da imagem

Como criar espaçamento entre imagem e painel group ?

<!DOCTYPE html>

<html>

<head>
    <title> Site </title>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylessheet" type="text/css" href="css/estilo.css"/>

</head>

<body>

    <div class="container">

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

 <div class="panel-group" id="paineis-sobre">

    <div class="panel panel-default">  

            <div class="panel-heading">
                <h3 class="panel-title" data-toggle="collapse" data-target="#primeiro-paragrafo" data-parent="#paineis-sobre"> Desdde 1935 </h3>
            </div>

             <div id="primeiro-paragrafo" class="collapse">
             <div class="panel-body">
                <p id="primeiro-paragrafo" class="collapse in"> Desde 1935 trazendo casas ,  mansões e prédio lindos para o mundo .</p>
                </div>
            </div>     
       </div>

               <div class="panel panel-default">
             <div class="panel-heading">
                <h3 class="panel-title" data-toggle="collapse" data-target="#segundo-paragrafo" data-parent="#paineis-sobre" >Preços acesssives</h3>
            </div>
            <div id="segundo-paragrafo" class="collapse">
                <div class="panel-body">
                    <p> Preços a partir de R$ 1000,00 </p> 
                </div>
            </div>
           </div>


    <div class="panel panel-default">

            <div class="panel-heading">
                <h3 class="panel-title" data-toggle="collapse" data-target="#terceiro-paragrafo" data-parent="#paineis-sobre">Alegria para colaborar com um mundo mais bonito</h3>
            </div>

            <div id="terceiro-paragrafo" class="collapse">
            <div class="panel-body">

                <p id="terceiro-paragrafo" class="collapse in"> Trazendo alegria para vida </p> 
            </div>
            </div>
            </div>
 </div>               
    <script
      src="https://code.jquery.com/jquery-1.9.1.min.js"
      integrity="sha256-wS9gmOZBqsqWxgIVgA8Y9WcQOa7PgSIX+rPA0VL2rbQ="
      crossorigin="anonymous"></script>

<script src="bootstrap/js/bootstrap.min.js"></script>

</body>
</html>
paineis-sobre {
    margin-top: 20 px;
}
1 resposta
solução!

Olá, Nicolle.

No seu código tem um espaço que faz toda a diferença:

paineis-sobre {
    margin-top: 20 px;
}

Tira o espaço que está entre o número 20 e o px. Se não funcionar avisa aí :-)

Ah! Sem o espaço o seu código ficará assim:

paineis-sobre {
    margin-top: 20px;
}