0
Я пытаюсь поставить свой навигатор под свой большой заголовок, но он идет впереди него, не только выше его, но и немного впередиNavbar над содержимым (как в слое выше)
в коде Navbar это под «Debugando», но он показывает над ним, я хочу, чтобы остаться под ним, но он не работает, я не могу найти почему. Я думаю, что это что-то вроде положения или поплавка.
Code (Первый Css затем HTML):
body {
\t margin: 0 0 0 0;
\t padding: 0 0 0 0;
\t font-family: Josefin Sans, sans-serif;
}
.navbar {
\t background: #428F48;
\t height: 40px;
\t border-radius: 0px;
\t margin: 0 0 0 0;
\t padding: 0 0 0 0;
}
.nav {
\t margin-top: 5px;
\t margin-left: 50px;
}
.nav-pills>li {
\t font-size: 24px;
\t margin-left: 20px;
}
.jumbotron {
\t background: #27b032;
\t width: 100%;
\t margin: 0 0 0 0;
\t padding: 0 0 0 0;
\t position: absolute;
}
.title {
\t font-size: 80px;
\t margin-left: 10%;
\t padding: 40px 0 40px 0;
\t float: left; \t
}
.description { \t
\t font-size: 20px;
\t margin-left: 5%;
\t padding-left: 3%;
border-left: 1px solid black;
height: 60px;
margin-top: 65px;
float: left;
text-align: center;
}
.description span{
\t margin-top: 15px;
\t position: absolute;
}
.dot {
\t \t -webkit-animation-name: blink;
\t \t -webkit-animation-duration: 1s;
\t \t -webkit-animation-fill-mode: both;
\t \t -webkit-animation-iteration-count: infinite;
\t \t animation-name: blink;
\t \t animation-duration: 1s;
\t \t animation-fill-mode: both;
\t \t animation-iteration-count: infinite;
}
@-webkit-keyframes blink {
\t \t
\t \t 25% {opacity: 100;}
\t \t 50% {opacity: 0;}
\t \t 25% {opacity: 100;}
}
@keyframes blink {
\t \t 25% {opacity: 100;}
\t \t 50% {opacity: 0;}
\t \t 25% {opacity: 100;}
}
html:<html>
<head>
\t <title>Debugando</title>
\t
\t <meta charset="UTF-8">
\t
\t <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
\t <link rel="stylesheet" type="text/css" href="style.css">
\t <link href='http://fonts.googleapis.com/css?family=Josefin+Sans:400,700&subset=latin-ext' rel='stylesheet' type='text/css'>
</head>
<body>
\t
\t <!--- Top -->
\t <div class="content-fluid">
\t \t <div class="jumbotron">
\t \t \t \t \t \t <div class="title">
\t \t \t \t \t \t \t
\t \t \t \t \t \t \t <span>Debugando</span><span class="dot">.</span>
\t \t \t \t \t \t </div>
\t \t \t \t \t
\t \t \t \t \t \t <div class="description">
\t \t \t \t \t \t \t
\t \t \t \t \t \t \t <span>
\t \t \t \t \t \t \t Descrição foda será inserida aqui.
\t \t \t \t \t \t \t </span>
\t \t \t \t \t \t </div>
\t \t \t \t \t
\t \t </div>
\t \t <div class="navbar">
\t \t \t
\t \t \t <ul class="nav-pills">
\t \t \t \t <li>Início</li>
\t \t \t \t <li>Contato</li>
\t \t \t </ul>
\t \t </div>
\t </div>
<!--<script src="js/jquery-2.1.3.min.js"></script>-->
<script src="js/bootstrap.min.js"></script>
</body>
</html>можно использовать загрузчик, если это необходимо. Спасибо, что пытались помочь!
Какую версию бутстрапа вы используете? –
Я использую последний, но я мог бы исправить это уже. Благодаря! – AdowTatep