Carrousel is not responsive

1

I'm having difficulty leaving a page with responsive bootstrap, with the full screen it is correct:

NowwhenItrytoseehowyouarerespondingonsmallerdevices,mycaruselisnotresponsive:

Hereisthecarcode:

<divid="myCarousel2" class="carousel slide" data-ride="carousel">
        <ol class="carousel-indicators">
            <li data-target="#myCarousel2" data-slide-to="0" class="active"></li>
            <li data-target="#myCarousel2" data-slide-to="1"></li>
            <li data-target="#myCarousel2" data-slide-to="2"></li>
            <li data-target="#myCarousel2" data-slide-to="3"></li>
        </ol>

        <div class="carousel-inner" role="listbox">
            <div class="item active">
              <img src="img\corpo1.png" alt="Chania" class="img-responsive">
                <div class="carousel-caption">
                    <div class="row text-center">

                        <div id="reportagem1" class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-center">
                            <h1 >Baixa auto estima ansiedade</h1>
                            <p>A ansiedade é um mal que acompanha gerações há anos. A sensação de desconforto não chega a ser classificada como uma doença, mas sim como um sintoma preocupante...</p>
                            <a class="" target="_blank" href="reportagens/LM_BAIXA_AUTO_ESTIMA_ANSIEDADE.pdf" role="button"><button class="but">LER MAIS</button></a>
                        </div>

                        <div id="reportagem2" class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-center">
                            <h1>Caminhada</h1>
                            <p>A caminhada é um dos exercícios mais populares, principalmente em quem quer perder peso. Até porque ela é um exercício eficaz e de baixo impacto, ideal para quem está acima do peso...</p>
                            <a class="" target="_blank" href="reportagens/LM_CAMINHADA.pdf" role="button"><button class="but">LER MAIS</button></a>
                        </div>
                    </div>
                </div>        
            </div>

            <div class="item">
              <img src="img\corpo1.png" alt="Chania">
                <div class="carousel-caption">
                    <div class="row">

                        <div id="reportagem3" class="col-xs-6 col-sm-6 col-md-4 col-lg-6 text-center">
                            <h1>Dieta de frango e batat</h1>
                            <p>É comum que muitas pessoas associem alimentos integrais como menos calóricos (confundindo-os frequentemente com produtos “light”), entretanto, é importante destacar que os alimentos integrais não necessariamente possuem menos calorias do que as suas versões refinadas....</p>
                            <a class="" target="_blank" href="reportagens/LM_DIETA_FRANGO_BATATA_FUNCIONADIDADE.pdf" role="button"><button class="but">LER MAIS</button></a>
                        </div>

                        <div id="reportagem4" class="col-xs-6 col-sm-6 col-md-4 col-lg-6 text-center">
                            <h1>Diferença entre alimento normais e integrais</h1>
                            <p>É comum que muitas pessoas associem alimentos integrais como menos calóricos (confundindo-os frequentemente com produtos “light”), entretanto, é importante destacar que os alimentos integrais não necessariamente possuem menos calorias do que as suas versões refinadas...</p>
                            <a class="" target="_blank" href="reportagens/LM_DIFERENCA_ENTRE_ALIMENTOS_INTEGRAIS_NORMAIS.pdf" role="button"><button class="but">LER MAIS</button></a>
                        </div>
                    </div>
                </div>        
            </div>

            <div class="item">
              <img src="img\corpo1.png" alt="Chania">
                <div class="carousel-caption">
                    <div class="row">

                        <div id="reportagem5" class="col-xs-6 col-sm-6 col-md-4 col-lg-6 text-center">
                            <h1>Educação no transito</h1>
                            <p>Respeito, cortesia, cooperação, solidariedade e responsabilidade constituem os eixos determinantes da transformação do comportamento do homem no trânsito. E, por isso, devem ser passados de geração a geração...lorem</p>
                            <a class="" target="_blank" href="reportagens/LM_EDUCACAO_NO_TRANSITO.pdf" role="button"><button class="but">LER MAIS</button></a>
                        </div>

                        <div id="reportagem6" class="col-xs-6 col-sm-6 col-md-2 col-lg-6 text-center">
                            <h1>Canela emagreçe e combate colesterol</h1>
                            <p>A canela possui uma série de benefícios. Ele ajuda a prevenir e combater o diabetes, controlando os níveis de açúcar no sangue e aumentando a sensibilidade à insulina...</p>
                            <a class="" target="_blank" href="reportagens/LM_CANELA_EMAGRECE_CONTROLA_COLESTEROL.pdf" role="button"><button class="but">LER MAIS</button></a>
                        </div>
                    </div>
                </div>        
            </div>

            <div class="item">
              <img src="img\corpo1.png" alt="Chania">
                <div class="carousel-caption">
                    <div class="row">

                        <div id="reportagem7" class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-center">
                            <h1>Halitose</h1>
                            <p>Halitose, mais conhecida como mau hálito, é um embaraçoso problema de higiene que ninguém quer ter, mas a maioria de nós tem de vez em quando. Para descobrir como curar o mau hálito, deve-se entender o que o causa...</p>
                            <a class="" target="_blank" href="reportagens/LM_HALITOSE.pdf" role="button"><button class="but">LER MAIS</button></a>
                        </div>

                        <div id="reportagem8" class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-center">
                            <h1>Menigites</h1>
                            <p>A meningite é uma infecção muito comum em adultos e crianças, mas podeser causada por diferentes agentes - vírus, bactérias, fungos, parasitas e até mesmo a bactéria da tuberculose. Isso faz com que existam diferentes tipos da doença, que pedem cuidados diferentes. Saiba como comparar os tipos de meningite.</p>
                            <a class="" target="_blank" href="reportagens/LM_MENINGITES_capa.pdf" role="button"><button class="but">LER MAIS</button></a>
                        </div>
                    </div>
                </div>        
            </div>

        </div>    

        <a class="left carousel-control" href="#myCarousel2" role="button" data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
            <span class="sr-only">Previous</span>
        </a>
        <a class="right carousel-control" href="#myCarousel2" role="button" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
            <span class="sr-only">Next</span>
        </a

CSS:

@charset "UTF-8"
@font-face {
    font-family: custom;
    src: local('../fonts/akuma.ttf'), url('../fonts/akuma.ttf');
}
body {
    font-family: custom;
}
.text-center .img-responsive {
    margin: 0 auto;
}
.but {
display: inline-block;
background-color: #c9302c;
color: #fff;
padding: 10px 20px;
text-decoration: none;
box-sizing: border-box;
font-size: 14px;
border: 0px;
}
#navbar {
    background-color: rgb(51, 51, 51);
    border-color: rgb(51, 51, 51);
}
#myCarousel {
    margin-top:-20px;
}
#new-text {
    background-color:#D9D9F3;   
}
#artigo {
    text-align:center;
}
#contact {
    padding-left:200px;
    background-image: url(../img/corpo2.png);
}
#midias {
    background-image: url(../img/corpo2.png);
    text-align:center;
    width: 100%;
}
#empresa {
    background-color:rgb(51, 51, 51);
    height: 59px;
}
#promocoes {
    text-align: justify;
}
#elyzium {
    text-align:right;
    background-color:rgb(51, 51, 51);
    height: 59px;
}
#rodape {
    width: 100%;
    bottom: 0;
}
#scrol-top {
    font-size: 30px;
}
#botaotopo {
    position: fixed;
    right: 20px;
    bottom: 20px;
    cursor: pointer;
}
li:hover {
    background-color: red;
}
#reportagem1 {
    text-align: justify;
}
#reportagem2 {
    text-align: justify;
}
#reportagem3 {
    text-align: justify;
}
#reportagem4 {
    text-align: justify;
}
#reportagem5 {
    text-align: justify;
}
#reportagem6 {
    text-align: justify;
}
#reportagem7 {
    text-align: justify;
}
#reportagem8 {
    text-align: justify;
}
    
asked by anonymous 09.01.2017 / 16:06

0 answers