Не отображаеться меню отзыва?

0
.header a, a:hover {
	color:#f0ad4e;
    text-decoration: none;
}
.header h1 {
	letter-spacing: 15px;
	font-size: 300%;
}

.header p {
	color:white !important;
	font-size: 90%;
	letter-spacing: 3px;
}
.nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover {
    color: #fff;
    background-color: #346270;
}
.nav-pills>li>a {
	color: #fff;

}
.nav-pills>li>a:hover {
	background-color: #346270 ;
}
.navbar-inverse {
  padding:1%;
  border-radius: 0;
}
@media (max-width: 767px) {
      .nav-pills>li {
      	float: none;

      }
     .nav-pills {
     	text-align: center;
     }
     .header h1 {
     	letter-spacing: 5px;
     	font-size: 280%;
     }
     .header {
     	text-align: center;
     }
}

.clear {
  clear: both;
  height: 63px;
}
.wrapper {
  min-height: 100%;
}
html, body {
  height: 100%;
}

.films_block {
  text-align: center;
}

.films_block img {
  margin-bottom: 5%;
  border-radius: 5px;
  border: solid 5px #dad7d5 ;
  width: 100%;
}
.film_label {
  padding: 2%;
  margin-bottom: 4%;
}

.margin-8 {
  margin -top: 8%;
}

.panel {
  border: none;
}

.panel-body {
  background-color: #f9f9f9;
}

.panel-info>.panel-heading {
    background-color: #f0ad4e;
    color: white;
    border-color: transparent;
}

.sidebar-header {
  font-size: 120%;
  letter-spacing: 2px;
}

.form-control {
 border-radius: 0px;
}
.input-lg {
  font-size: 14px;
}

.list-group-item-warning {
  color: #8a6d3b;
  background-color :  #f9f9f9;

}

.badge {
  background-color: #000000;
}

.info-block {
  font-size:120%;
}

.info-block .badge {
  font-size: 80%;
}
.info-block span {
  margin-right:3%;
}
footer {
  color: #666;
  background: #222;
  padding: 17px 0 18px 0;
  border-top: 1px solid #000;

}
footer a {
  color: #999;
}
footer a:hover {
  color: #efefef;
}
<!DOCTYPE html>
<html lang="ru">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Киномонстр Bootstrap</title>

    <!-- Bootstrap -->
    <link href="assets/css/bootstrap.min.css" rel="stylesheet">


    <! - -Main Style - - >
     <link href="assets/css/style.css" rel="stylesheet">
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    
      <div class="container-fluid" >
        <div class="row">
        
        <nav role="navigation" class="navbar navbar-inverse">
          <div class="container">
            <div class="navbar-header header">
              <div class="container">
                <div class="row">
                  <div class="col-lg-12">
                    <h1><a href="#">КиноМонстр</a></h1>
                    <p>Кино - наша страсть </p>
                  </div>
                </div>
              </div>
              <button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle">
                <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 id="navbarCollapse" class="collapse navbar-collapse navbar-right">
             
              <ul class="nav nav-pills">
                <li> <a href="#">Главная</a> </li>
                <li class="active"> <a href="#">Фильмы</a> </li>
                <li> <a href="#">Сериалы</a> </li>
                <li> <a href="#">Рейтинг фильмов</a> </li>
                <li> <a href="#">Контакты</a> </li>
              </ul>
          </div>
          
        </nav>
     
        
      </div>
    </div>
    <div class="wrapper">
      <div class="container">
        <div class="row">
          <div class="col-lg-9 col-lg-push-3">


            <form role="search" class="visible-xs">
                <div class="form-group">
                  <div class="input-group">
                    <input type="search" class="form-control input-lg" placeholder="Ваш вопрос?">
                     <div class="input-group-btn">
                       <button class="btn btn-default btn-lg" type="submit"><i class="glyphicon glyphicon-search"></i></button>
                      
                     </div>
                  </div>
                </div>
              </form>
              <h1>Интерстеллар</h1>
              <hr>
              <div class="embed-responsive embed-responsive-16by9">
                <iframe  class="embed-responsive-item" src="https://www.youtube.com/embed/xHGRCBV46ik" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>
                  
                </iframe></div>
                <div class="well info-block text-center">
                  Год: <span class="badge">2015</span>
                  Рейтинг: <span class="badge">8.9</span>
                  Режиссёр: <span class="badge">Кристофер Нолан</span>
                </div>
             <div class="margin-8"></div>

             <h2>Описание Интерстеллар</h2>
             <hr>

             <div class="well">
               Фильм повествует о путешествиях группы исследователей, которые используют недавно обнаруженный пространственно-временной тоннель, чтобы обойти ограничения полёта человека в космосе и покорить огромные расстояния на межзвёздном корабле.
             </div>
          </div>
          

          <div class="margin-8"></div>

         <div class="col-lg-3 col-lg-pull-9">
          <h2>Отзывы об Интерстеллар</h2>
          <hr>
         
         <div class="panel panel-default">
         <div class="panel-heading">Panel heading without title</div>
        <div class="panel-body">
         Panel content
          </div>
        </div>


         

        <div class="panel panel-info hidden-xs">
        <div class="panel-heading"><div class="sidebar-header">Поиск</div></div>
        <div class="panel-body">
        <form role="search">
        <div class="form-group">
        <div class="input-group">
        <input type="search" class="form-control input-lg" placeholder="Ваш вопрос?">
        <div class="input-group-btn">
         <button class="btn btn-default btn-lg" type="submit"><i class="glyphicon glyphicon-search"></i></button>
                      
                    </div>
                  </div>
                </div>
              </form>
              

            </div>
          </div>
          
          <div class="panel panel-info">
            <div class="panel panel-info">
             <div class="panel-heading"><div class="sidebar-header">Вход</div></div>
             <div class="panel-body">
               <form role="form">
                 <div class="form-group">
                   <input type="text" class="form-control input-lg" placeholder="Логин">
                 </div>
                 <div class="form-group">
                   <input type="password" class="form-control input-lg" placeholder="Пароль">
                 </div>
                 
                 <button type="submit" class="btn btn-warning pull-right">Вход</button>
                    

               </form>


             </div>
            </div>

             
            <div class="panel panel-info">
             <div class="panel-heading"><div class="sidebar-header">Новости</div></div>
             <div class="panel-body">
               <p>31.02.2017</p>
               <p>Мы запустили новый сервис</p>

             </div>
            </div>





                      <div class="panel panel-info">
            <div class="panel panel-info">
             <div class="panel-heading"><div class="sidebar-header">Рейтинг фильмов</div></div>
             <div class="panel-body">
              
            <ul class="list-group">

            <li class="list-group-item list-group-warning"><span class="badge">8.9</span>
              <a href="#">Интерстеллар</a>
            </li>
            <li class="list-group-item list-group-warning"><span class="badge">8.7</span>
              <a href="#">Безумный макс</a>
            </li>
            <li class="list-group-item list-group-warning"><span class="badge">8.3</span>
              <a href="#">Матрица</a>
            </li>
            <li class="list-group-item list-group-warning"><span class="badge">8.1</span>
              <a href="#">Облачный атлас</a>
            </li>
            <li class="list-group-item list-group-warning"><span class="badge">8.9</span>
              <a href="#">Интерстеллар</a>
            </li>
            <li class="list-group-item list-group-warning"><span class="badge">8.7</span>
              <a href="#">Безумный макс</a>
            </li>
            <li class="list-group-item list-group-warning"><span class="badge">8.3</span>
              <a href="#">Матрица</a>
            </li>
            <li class="list-group-item list-group-warning"><span class="badge">8.1</span>
              <a href="#">Облачный атлас</a>
            </li>
          </ul>

             </div>
            </div>

          </div>

          </div>

        </div>

      </div>

      <div class="clear">
        </div>

    </div>

    <footer>
      <div class="container">
        <p class="text-center"> <a href="http://ru.kinomonstr.com">KinoMonstr</a></p>
      </div>

    </footer>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="assets/js/bootstrap.min.js"></script>
  </body>
</html>
bootstrap

1 ответов

0

У тебя разное количество открытых и закрытых тегов, из-за этого ошибка с версткой.

Sign up or Log in to write an answer