2015-03-25 2 views
0

У меня есть папка с бутстрапом. При настройке я изменил @ grid-float-breakpoint на md, а на моем сайте навигационная панель рухнула с 320 до 640, но 768px нет! в 768 он показывает сложенное меню, но содержание этого меню является меню настольной версии, посмотрите на это:Bootstrap показывает настольное навигационное меню на 768

It shows desktop navbar

Как я могу это исправить?

HTML КОД:

<nav class="navbar navbar-default navbar-simelsa"> 
    <div class="container"> 
    <!-- Brand and toggle get grouped for better mobile display --> 
    <div class="navbar-header"> 
     <div class="menu-text hidden-lg hidden-md">Menú<button type="button" class="navbar-toggle collapsed navbar-bottom" data-toggle="collapse" data-target="#navbar-default"> 
     <span class="sr-only">Toggle navigation</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 
     </div> 
    </div> 

    <!-- Collect the nav links, forms, and other content for toggling --> 
    <div class="collapse navbar-collapse navbar-left" id="navbar-default"> 
     <ul class="nav navbar-nav nav-simelsa-ul"> 
     <li class="inicio"> 
      <span class="border-left"></span> 
      <span class="inicio-img"></span> 
      <span class="border-right"></span> 
      <a href="#">Inicio</a> 
     </li> 
     <li class="nosotros"> 
     <span class="nosotros-img"></span> 
     <span class="border-right"></span> 
     <a href="#">Nosotros</a> 
     </li> 
     <li class="dropdown servicios"> 
     <span class="servicios-img"></span> 
     <span class="border-right"></span> 
      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Servicios <span class="caret hidden-xs"></span><span class="hidden-lg hidden-md hidden-sm">&#8594;</span></a> 
      <ul class="dropdown-menu" role="menu"> 
      <li><a href="#">Action</a></li> 
      <li><a href="#">Another action</a></li> 
      <li><a href="#">Something else here</a></li> 
      <li class="divider"></li> 
      <li><a href="#">Separated link</a></li> 
      <li class="divider"></li> 
      <li><a href="#">One more separated link</a></li> 
      </ul> 
     </li> 
     <li class="productos"> 
     <span class="productos-img"></span> 
     <span class="border-right"></span> 
     <a href="#">Productos</a> 
     </li> 
     <li class="noticias"> 
     <span class="noticias-img"></span> 
     <span class="border-right"></span> 
     <a href="#">Noticias</a> 
     </li> 
     <li class="contacto"> 
     <span class="contacto-img"></span> 
     <a href="#">Contacto</a> 
     </li> 
    </ul> 
    <div class="lang navbar-right nav navbar-nav"><span class="sp"><a href="#">ESP</a></span> | <span class="en"><a href="#">ENG</a></span></div> 
    </div><!-- /.navbar-collapse --> 
    </div><!-- /.container-fluid --> 
</nav> 

CSS КОД ИЗ МОИХ ТИПОВ:

@media (min-width: 1024px) { 
.slick-prev, .slick-next { 
    top: -12% !important; 
    } 
} 
@media (max-width: 1024px) { 

.header-bg { 
    background: none !important; 
} 

.slick-prev, .slick-next { 
    top: -13% !important; 
    } 
#navbar-simelsa a { 
    font-size: 0.8em !important; 

} 

.slider-bottom { 
    background-position: -35px -479px !important; 
} 
.box-content-carousel:hover .slider-bottom { 
    background-position: -33px -499px !important; 

} 
} 


.navbar-default .navbar-nav>li:hover{ 

} 

.nav .open>a, .nav .open>li:focus, .nav .open>li:hover, .nav>li:focus, .nav>li:hover { 
    color: #333; 
    background-color: #dfdfdf !important; 

} 
.navbar-default .navbar-nav>li:active{ 
    color: #333; 
    background-color: transparent !important; 
} 
.navbar-nav>li>.dropdown-menu { 
border-bottom: 2px solid #22a6cf; 
} 

.dropdown-menu>li>a, .navbar-default .navbar-nav>li { 

    -webkit-transition: all 0.3s ease; /* Safari and Chrome */ 
    -moz-transition: all 0.3s ease; /* Firefox */ 
    -o-transition: all 0.3s ease; /* IE 9 */ 
    -ms-transition: all 0.3s ease; /* Opera */ 
    transition: all 0.3s ease; 

} 

.dropdown-menu>li>a:hover { 
    color: #22a6cf !important; 
} 

@media (max-width: 768px) { 

.navbar { 
      margin-bottom: 0px !important; 
    } 
.footer-copyright { 
    margin-left: 0px !important; 
} 
#navbar-simelsa a { 
    font-size: 0.6em !important; 
} 
#navbar-simelsa ul.navbar-nav li { 
    margin-right: 10px !important; 
} 
} 
@media (max-width: 640px) { 

.header-bg { 
    height: 110px !important; 
    padding: 0 !important; 
    margin: 0 !important; 
    } 
    .header-logo { 

} 

.social { 
    margin-top: 10px !important; 
    margin-left: auto; 
    margin-right: auto; 
    text-align: center; 
} 

#layerslider .ls-s-1 { 
height: 60px !important; 
} 
.footer-logo { 
    padding-top: 30px; 
} 

.slider-bottom { 
    background-position: -55px -479px !important; 
} 
.box-content-carousel:hover .slider-bottom { 
    background-position: -53px -499px !important; 

} 

} 

@media (max-width: 639px) { 
    .header-bg { 
    height: 95px !important; 
} 
.hide-640 { 
    display: none; 
} 
.news-img img { 
    width: 100%; 
} 
} 
@media (min-width: 640px) { 
    #layerslider-qs .ls-s-1 { 
    background: #e3ebed; 
    width: 200px; 
    height: 357px !important; 
    top: 0px !important; 
    left: 0px !important; 
    padding: 30px 30px 30px 35px; 
    font-family: 'Raleway', sans-serif !important; 
    font-weight: 200; 
    line-height: 2em !important; 
    color: #2c7081; 
    text-align: center; 
    font-size: 1.1em !important; 
} 

.show-480 { 
    display: none; 
} 
} 
@media (max-width: 480px) { 

     #layerslider-qs .ls-s-1 { 
    background: #e3ebed; 
    width: 110px; 
    height: 357px !important; 
    top: 0px !important; 
    left: 0px !important; 
    padding: 30px 30px 30px 35px; 
    font-family: 'Raleway', sans-serif !important; 
    font-weight: 200; 
    line-height: 2em !important; 
    color: #2c7081; 
    text-align: center; 
    font-size: 0.8em !important; 
} 
    .title-container-inicio { 
     font-size: 1.3em !important; 
    } 
.footer-copyright { 

    font-size: 0.6em !important; 

} 

#layerslider .ls-s-1 { 

    height: 40px !important; 

} 

.slider-bottom { 
    background-position: -40px -479px !important; 
} 
.box-content-carousel:hover .slider-bottom { 
    background-position: -43px -499px !important; 

} 


    .slick-prev, .slick-next { 
    top: -13% !important; 
    } 

.box-content-carousel:hover .slider-bottom { 
    background-position: -38px -499px !important; 

} 

} 
@media (max-width: 479px) { 
.slider-bottom { 
    background-position: 22px -479px !important; 

    } 
    .box-content-carousel:hover .slider-bottom { 
    background-position: 24px -499px !important; 

} 
.box-content-carousel img { 
    margin-left: auto !important; 
    margin-right: auto !important; 
    } 
    .slick-prev, .slick-next { 
    top: -11% !important; 
    } 

    } 

@media (max-width: 320px) { 


.quienes-somos h1 { 

    font-size: 1.5em !important; 
} 

.qs-links p { 
    font-size: 1.1em !important; 
} 
     .header-bg { 
    height: 90px !important; 
} 
    .slick-prev, .slick-next { 
    top: -11% !important; 
    } 
    .box-content-carousel:hover .slider-bottom { 
    background-position: -15px -499px !important; 
} 
.slider-bottom { 
    background-position: -18px -479px !important; 
} 
    } 

@media (min-width: 640px) and (max-width: 768px) { 

.box-content-carousel h2 { 
    font-size: 1.1em !important; 
} 
} 

html { 
    height: 100%; 
} 

body { 
     height: 100%; 
    margin: 0; 
    background-repeat: no-repeat; 
filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#dbeef4, endColorstr=#fff); 
background-image:-moz-linear-gradient(top, #dbeef4 40%, #fff 50%); 
background-image:-webkit-linear-gradient(top, #dbeef4 40%, #fff 50%); 
background-image:-ms-linear-gradient(top, #dbeef4 40%, #fff 50%); 
background-image:linear-gradient(top, #dbeef4 40%, #fff 50%); 
background-image:-o-linear-gradient(top, #dbeef4 40%, #fff 50%); 
    background-image: -webkit-gradient(linear, right top, right bottom, color-stop(40%,#dbeef4), color-stop(50%,#fff)); 
    } 

.nav .open>a, .nav .open>a:hover, .nav .open>a:focus { 
    background: transparent !important; 
} 
.header-logo { 
    background-color: #33add3; 
    width: 100%; 
box-shadow: inset 0 -21px 19px -24px #808080; 
    -moz-box-shadow: inset 0 -21px 19px -24px #808080; 
    -webkit-box-shadow: inset 0 -21px 19px -24px #808080; 
} 
.header-bg { 
    /* margin: 0 auto; */ 
    background-image:url('../images/header-img.png'); 
    background-repeat: no-repeat; 
    background-position: 500px 0; 
    height: 133px; 
} 
.navbar-simelsa .lang a { 
    color: #000; 
    text-decoration: none; 
    font-size: 0.9em; 
    -webkit-transition: all 0.5s ease; /* Safari and Chrome */ 
    -moz-transition: all 0.5s ease; /* Firefox */ 
    -o-transition: all 0.5s ease; /* IE 9 */ 
    -ms-transition: all 0.5s ease; /* Opera */ 
    transition: all 0.5s ease; 
    font-weight: 400; 
    font-family: 'Ubuntu', sans-serif !important; 
} 
.sp a:hover { 
    color: #c50000; 
} 

.en a:hover { 
    color: #22a6cf; 
} 

.logo { 
    margin-top: 20px; 
} 

.nopadding { 
    padding: 0 !important; 
    margin: 0 !important; 
} 

.social ul li { 
    display: inline-block; 
    margin-right: 5px; 

} 

.social ul { 
    list-style-type: none !important; 
} 

.social { 
    margin-top: 73px; 
} 

/* Distorsiona el dropdown 

#navbar-simelsa ul.navbar-nav li:first-child { 
    border-left: 1px solid #dfdfdf; 
    padding-left: 35px; 

} 
#navbar-simelsa ul.navbar-nav li { 
    margin-right: 20px; 
    border-right: 1px solid #dfdfdf; 
    padding-left: 15px; 
    height: 26px; 
} 

.dropdown-menu .divider { 
    height: 1px; 
    margin: -6px 0px 13px 0px; 
    overflow: hidden; 
    background-color: #e5e5e5; 
} 

.dropdown-menu li:first-child { 
    padding-top: 10px; 

} 

#navbar-simelsa ul.navbar-nav li { 
    margin-right: 20px; 
    border-right: 1px solid #dfdfdf; 
    padding-left: 15px; 
    height: 26px; 
} 

#navbar-simelsa a { 
    font-family: 'Raleway', sans-serif !important; 
    text-transform: uppercase; 
    font-size: 1em; 
    line-height: 0em; 
    font-weight: 200; 
    color: #464646; 

} 

*/ 

.navbar-default .navbar-nav>li>a { 
    font-family: 'Raleway', sans-serif !important; 
    text-transform: uppercase; 
    font-size: 1em; 
    font-weight: 200; 
    margin-left: 20px !important; 
    color: #464646; 
} 

@media (min-width: 1200px) { 

.navbar-default .navbar-nav .open .dropdown-menu>li>a { 
    font-family: 'Raleway', sans-serif !important; 
    text-transform: uppercase; 
    font-size: 1em; 
    font-weight: 200; 
    margin-left: 0px !important; 
    color: #464646; 

} 

} 

@media (max-width: 1200px) { 

.lang { 
    border-right: 0px !important; 
    border-left: 0px !important; 
    line-height: 1.5em !important; 
    margin-left: 20px !important; 
    height: 29px !important; 
    text-decoration: none; 
} 

.navbar-default .navbar-nav .open .dropdown-menu>li>a { 
    font-family: 'Raleway', sans-serif !important; 
    text-transform: uppercase; 
    font-size: 1em; 
    font-weight: 200; 
    margin-left: 20px !important; 
    color: #464646; 

} 
} 

#navbar-simelsa a:hover, #navbar-simelsa a:active, #navbar-simelsa a:focus { 
     background-color: transparent; 
} 


@media (min-width: 768px) { 
    .lang { 
    border-right: 0px !important; 
    border-left: 0px !important; 
    line-height: 3.5em !important; 
    margin-left: 20px !important; 
    height: 49px !important; 
    text-decoration: none; 
} 
    .contacto { 
     border-right: 0px !important; 
    } 

    .nav-simelsa-ul>li:first-child a { 

} 

    .nav-simelsa-ul>li>a { 
    font-family: 'Raleway', sans-serif !important; 
    text-transform: uppercase; 
    font-size: 1em; 
    line-height: 1.5em; 
    height: 49px !important; 
    font-weight: 200; 
    color: #464646; 

} 
    .navbar .navbar-nav { 
     display: inline-block; 
     float: none; 
     vertical-align: top; 
     height: 26px; 

     } 
    .navbar .navbar-collapse { 
     text-align: center; 
    } 
.border-right { 
    background: #dfdfdf; 
    padding-left: 1px; 
    float: right; 
    margin-top: 9px; 
    padding-bottom: 32px; 
} 
.border-left { 
    background: #dfdfdf; 
    padding-left: 1px; 
    float: left; 
    margin-top: 9px; 
    padding-bottom: 32px; 
} 
    /* Para que funcione el cambio de color rollover 
    .nav-simelsa-ul>li { 

    padding-left: 10px !important; 
    margin-right: 10px; 
    padding-right: 10px; 
    padding-top: 10px; 
    height: 26px; 

} 
*/ 
.nav-simelsa-ul>li { 
    height: 49px; 
} 
.nav-simelsa-ul>li.inicio { 

    width: 113px; 

} 

.nav-simelsa-ul>li.nosotros { 

    width: 130px; 

} 

.nav-simelsa-ul>li.servicios { 

    width: 125px; 

} 

.nav-simelsa-ul>li.productos { 

    width: 146px; 

} 

.nav-simelsa-ul>li.noticias { 

    width: 125px; 

} 

.nav-simelsa-ul>li.contacto { 

    width: 135px; 

} 

.servicios .caret { 

    margin-bottom: 15px; 

} 
.navbar-simelsa { 
     background: #f2f2f2; 
    border: 1px solid #fff; 
    margin-bottom: 0px !important; 
} 
} 
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { 
    background: transparent !important; 
} 



.menu-text { 
     border: 1px solid #D2D2D2; 
    height: 45px; 
    font-family: 'Ubuntu', sans-serif; 
    font-size: 1.1em; 
    color: #939393; 
    border-radius: 10px; 
    margin-left: 5px; 
    margin-right: 5px; 
    padding: 10px 0px 10px 20px; 
    margin-top: 10px; 
    margin-bottom: 15px; 
} 
.navbar-bottom { 
    position: relative !important; 
    margin-top: 0px !important; 
    border: 0px !important; 
    padding-top: 5px; 
} 

.navbar-toggle .icon-bar { 
    display: block; 
    width: 22px; 
    height: 2px; 
    background-color: #939393; 
    border-radius: 1px; 
} 


.inicio-img, .nosotros-img, .servicios-img, .productos-img, .noticias-img, .contacto-img { 
    padding-left: 20px; 
    padding-top: 21px; 
    margin-top: 14px; 
    margin-left: 8px; 
    float: left; 
} 

.inicio-img { 
    background-position: 0px 0px; 
} 

.nosotros-img { 
    background-position: 0px -28px; 

    } 

.servicios-img { 
    background-position: 0 -59px; 
} 

.noticias-img { 
    background-position: 4px -111px; 
    padding-left: 25px !important; 
    padding-top: 22px !important; 
} 

.contacto-img { 
    background-position: 0 -138px; 
} 

.productos-img { 
    background-position: 0 -84px; 
} 

.inicio-img, .nosotros-img, .productos-img, .noticias-img, .servicios-img, .contacto-img, .calendar, .slick-prev, .slick-next, .slider-bottom, .container-bottom-bg, .certified, .arrow-right { 

     background-image:url('../images/sprites.png'); 
     background-repeat: no-repeat; 
} 
.white-bg { 
    background: #fff; 
} 
/* Breadcrumb */ 
.bc-simelsa>li+li:before { 

    content: none !important; 
} 

.bc-simelsa>li+li:after { 

content: "/ "; 
padding-left: 4px; 

} 

.bc-simelsa>li+li:last-child:after { 
content: none !important; 
} 
.bc-simelsa a { 
    color: #818181; 
    text-decoration: none; 

} 
.bc-simelsa { 
    color: #818181; 
    font-family: 'Raleway', sans-serif !important; 
    font-weight: 300; 
    font-size: 1em !important; 
    text-decoration: none; 
    background: #fff; 
    margin-top: 20px; 
    margin-bottom: 0px !important; 
    padding: 8px 10px; 
} 
.more-padding { 
    padding-left: 5px; 
    padding-right: 5px; 
} 
.arrow-right { 
    padding: 11px 3px; 
    background-position: 0 -626px; 
} 
.border-h1 { 
    width: 170px; 
    height: 1px; 
    background: #cccccc; 
    position: relative; 
    margin-bottom: 10px; 
    display: block; 
} 
.bc-simelsa>li+li:before { 
    color: #818181; 
    padding: 0 2px !important; 
} 
.two-border-hr { 
    background: #fff; 
    height: 2px; 
    border-top: 1px solid #c6c6c6 !important; 
    border-bottom: 1px solid #c6c6c6 !important; 
    margin-top: 0px !important; 
    margin-right: 5px; 
    margin-left: 5px; 

} 

/* Quiénes somos */ 

.quienes-somos h1 { 
font-family: 'Raleway', sans-serif !important; 
font-weight: 500; 
font-size: 2.1em; 
margin-top: 10px; 
color: #83959b; 

} 

.quienes-somos p { 
font-family: 'Raleway', sans-serif !important; 
font-weight: 300; 
line-height: 2.4em; 
font-size: 1em; 
margin-bottom: 25px; 

} 

.quienes-somos p.desc1 { 

color: #33add3; 

} 
.qs-links li { 
    margin-bottom: 20px; 
} 
.qs-links a { 
    text-decoration: none; 

} 
.quienes-somos p.desc2 { 

color: #a3a3a3; 
margin-bottom: 30px; 

} 
.qs-links { 
    list-style-type: none; 
    padding-left: 0px; 
} 
.qs-links img { 
    margin-right: 10px; 
} 
.qs-links p { 
    font-size: 1.2em; 
    color: #297b94; 
    font-weight: 200 !important; 
} 

.compartir { 
    margin-bottom: 20px; 
    margin-left: 15px; 
} 

@-webkit-keyframes swing 
{ 
    15% 
    { 
     -webkit-transform: translateY(5px); 
     transform: translateY(5px); 
    } 
    30% 
    { 
     -webkit-transform: translateY(-5px); 
     transform: translateY(-5px); 
    } 
    50% 
    { 
     -webkit-transform: translateY(3px); 
     transform: translateY(3px); 
    } 
    65% 
    { 
     -webkit-transform: translateY(-3px); 
     transform: translateY(-3px); 
    } 
    80% 
    { 
     -webkit-transform: translateY(2px); 
     transform: translateY(2px); 
    } 
    100% 
    { 
     -webkit-transform: translateY(0); 
     transform: translateY(0); 
    } 
} 
@keyframes swing 
{ 
    15% 
    { 
     -webkit-transform: translateY(5px); 
     transform: translateY(5px); 
    } 
    30% 
    { 
     -webkit-transform: translateY(-5px); 
     transform: translateY(-5px); 
    } 
    50% 
    { 
     -webkit-transform: translateY(3px); 
     transform: translateY(3px); 
    } 
    65% 
    { 
     -webkit-transform: translateY(-3px); 
     transform: translateY(-3px); 
    } 
    80% 
    { 
     -webkit-transform: translateY(2px); 
     transform: translateY(2px); 
    } 
    100% 
    { 
     -webkit-transform: translateY(0); 
     transform: translateY(0); 
    } 
} 

.social ul li:hover 
{ 
     -webkit-animation: swing 1s ease; 
     animation: swing 1s ease; 
     -webkit-animation-iteration-count: 1; 
     animation-iteration-count: 1; 
} 

/* LayerSlides */ 

#layerslider-qs { 
    margin-bottom: 20px; 
} 

#layerslider .ls-s-1 { 
    background: #33add3; 
    width: 284px; 
    height: 260px; 
    top: 45px !important; 
    left: 60px !important; 
    padding: 30px 20px 30px 35px; 
} 

#layerslider .ls-s-1 .title-box-slider { 

    font-family: 'Raleway', sans-serif !important; 
    font-weight: 400; 
    color: #fff; 
    line-height: 1.4em; 
    font-size: 1.5em !important; 

} 

#layerslider .ls-s-1 p.desc { 
    font-family: 'Raleway', sans-serif !important; 
    font-weight: 400; 
    color: #1b1c21; 
    line-height: 2em !important; 
    font-size: 0.95em !important; 

}  

.ls-container { 
    margin-top: 2px !important; 
    } 

.hr-img { 
    margin: 0 auto; 
    margin-top: 25px; 
    margin-bottom: 25px; 
} 

.welcome { 
    font-family: 'Raleway', sans-serif !important; 
    color: #999999;  
} 
.welcome h1 { 
    font-weight: 200; 
    font-size: 2.1em; 
} 
.welcome p { 
    font-weight: 400; 
    font-size: 1.1em; 
    line-height: 1.7em; 
    margin-bottom: 25px; 
} 

.news { 
    background: #e3ebed; 
    min-height: 113px; 
} 

.news-img { 
     overflow: hidden; 

} 
.news img, .news .box-text p { 
     -webkit-transition: all 0.5s ease; /* Safari and Chrome */ 
    -moz-transition: all 0.5s ease; /* Firefox */ 
    -o-transition: all 0.5s ease; /* IE 9 */ 
    -ms-transition: all 0.5s ease; /* Opera */ 
    transition: all 0.5s ease; 
} 
.news:hover img { 
     -webkit-transform:scale(1.25); /* Safari and Chrome */ 
    -moz-transform:scale(1.25); /* Firefox */ 
    -ms-transform:scale(1.25); /* IE 9 */ 
    -o-transform:scale(1.25); /* Opera */ 
    transform:scale(1.25); 
} 
.news:hover .box-text p { 
    color: #707070; 
} 


.calendar { 
    background-position: 0 -333px; 
    padding-left: 20px; 
    color: #33add3; 
    font-size: 0.8em; 
    font-weight: 300;  

} 
.box-text { 
    padding: 10px; 
    font-family: 'Raleway', sans-serif !important; 
} 
.box-text p { 
    margin-top: 10px; 
    font-size: 1em; 
    font-weight: 400; 
    color: #000; 
} 
.nopadding { 
    padding: 0 !important; 
    margin: 0 !important; 
} 

.title-container-inicio { 
    border-bottom: 1px solid #f2f2f2; 
    font-size: 1.6em; 
    font-weight: 500; 
    font-family: 'Raleway', sans-serif !important; 
    color: #464646; 
    margin-top: 20px; 
    margin-right: 10px; 
    margin-bottom: 0px !important; 
    padding-bottom: 0px; 
} 
.box-news { 
    padding-left: 10px; 
    padding-right: 10px; 
} 

/* Slider 2 */ 

.box-content-carousel { 
    width: 268px; 
    margin-right: 30px; 
} 
.slider-2 { 
    margin-left: 15px; 
} 

.slick-prev.slick-disabled { 
    background-position: 0 -416px !important; 

} 
.slick-next.slick-disabled { 
    background-position: 0 -446px !important; 

} 
.slick-prev, .slick-next { 
    width: 25px !important; 
    height: 25px !important 
} 

.slick-next { 
    right: 5px !important; 
    background-position: 0 -356px !important; 
} 

.slick-prev { 
    right: 35px !important; 
    background-position: 0 -386px !important; 
} 

.box-content-carousel h2, .box-content-carousel p { 
    font-family: 'Raleway', sans-serif !important; 
    color: #838484;  
    font-weight: 200 !important; 

} 

.box-content-carousel h2 { 
    font-size: 1.2em; 
    margin-bottom: 5px; 
} 

.slider-img { 
    border: 3px solid transparent; 
    transition: all 0.5s ease; 
} 
.box-content-carousel:hover .slider-img { 
    border: 3px solid #33add3; 
    border-radius: 3px; 
} 

.box-content-carousel:hover { 
    cursor: pointer; 

} 
.slider-bottom { 
    background-position: 0 -479px; 
    padding-top: 13px; 
    display: block; 
    -o-transition: all .5s; 
    -moz-transition: all .5s; 
    -webkit-transition: all .5s; 
    -ms-transition: all .5s; 
} 

.box-content-carousel:hover .slider-bottom { 
    background-position: 2px -499px; 

} 

/* Footer */ 

.footer { 
    background: #f5f6f6; 
} 

.container-bottom-bg { 
    background-position: 73px -524px !important; 
    padding-top: 20px; 
    display: block; 
    width: 738px; 

}  

.footer-copyright { 
    margin-left: 100px; 
} 

.footer-copyright, .footer-copyright a { 
    color: #33add3; 
    font-family: 'Raleway', sans-serif !important; 
    font-weight: 500 !important; 
    font-size: 1em; 
    text-decoration: none; 
    margin-top: 15px; 

} 
.link-footer-col { 
    max-width: 870px; 
    margin-bottom: 40px; 

} 

.link-footer-col h4 a, .link-footer-col p a { 
    font-family: 'Raleway', sans-serif !important; 
    font-weight: 300 !important; 
    font-size: 0.8em; 
    text-decoration: none !important; 

} 

.link-footer-col h4 a { 

    color: #33add3 !important; 
    text-transform: uppercase; 

} 

.link-footer-col p a { 

    color: #464646 !important; 
    font-size: 0.95em !important; 
} 

.link-footer-col p { 

    line-height: 0.9em; 

} 

.certified { 
    background-position: 0px -530px !important; 
    padding: 280px; 
    display: block; 
} 

.certified-img { 
    margin-top: 80px; 
} 

Спасибо.

+0

Я сделал вас jsfiddle. http://jsfiddle.net/vhrahnct/. Ошибка сохраняется, если вы удалите все css, так что это не ошибка. Ошибка показывает ширину ~ 970px до ~ 750px width, что переводится в '-md' и' -sm' –

+0

Спасибо, так как я могу это исправить? – Peter

+0

Я еще не знаю (пока). Я сужу причину до того, что это –

ответ

0

Я получил это работает: http://jsfiddle.net/vhrahnct/1/

Вы все еще должны укладывать Navbar, но меню штуковина корректно отображая прямо сейчас. Я изменил

<div class="menu-text hidden-lg hidden-md">Menú ...</div> 

в

<div class="menu-text visible-xs-block">Menú ...</div> 
+0

Привет, Flo, я изменил «menu-text hidden-lg hidden-md» на «menu-text visible-xs-block», и теперь меню исчезает в 768, оно не отображается любое меню ... Спасибо. Если я добавляю видимый-sm-блок, он показывает, но показывает версию меню на рабочем столе. – Peter

+0

Когда вы хотите, чтобы меню отображалось? только xs и sm? Существуют ли разные варианты меню, которое вы хотите показать в xs и sm? –

0

Я установил ее.

Я двигаюсь:

.nav-simelsa-ul>li>a { 
    font-family: 'Raleway', sans-serif !important; 
    text-transform: uppercase; 
    font-size: 1em; 
    line-height: 1.5em; 
    height: 49px !important; 
    font-weight: 200; 
    color: #464646; 

} 
.navbar .navbar-nav { 
     display: inline-block; 
     float: none; 
     vertical-align: top; 
     height: 26px; 

} 

.navbar .navbar-collapse { 
     text-align: center; 
} 

От 768px мин до 1024px мин размер экрана.

Спасибо!

Смежные вопросы