* {
margin: 0;
padding: 0;
}
body {
background-image: url(FonCar.png);
background-size: cover;
overflow-x: hidden;
width: 100vw;
}
body::-webkit-scrollbar {
width: 0.7em;
background: transparent;
}
body::-webkit-scrollbar-thumb {
background: #1D1E22;
}
.shapka {
height: 250px;
}
.car {
pointer-events: none;
width: 600px;
height: 375px;
left: 23%;
top: -60px;
}
.logo {
width: 500px;
height: 200px;
float: left;
margin-top: -25%;
}
.logotable {
position: relative;
height: 200px;
}
.box {
width: 400px;
height: 55px;
background: white;
opacity: 0.9;
}
.zagolovok {
text-align: center;
color: black;
font-size: 26px;
font-family: Impact;
word-wrap: break-word;
white-space: nowrap;
}
.bg-light {
opacity: 0.92;
}
.content {
word-wrap: break-word;
background-color: white;
min-height: calc(100vh - 100px);
}
.footer {
height: 80px;
background: #1D1E22;
margin: 0;
}
.labelincontent {
width: 100%;
/* Ширина */
text-align: left;
/* Выравниваем по правому краю */
background: #1D1E22;
padding-left: 5px;
color: white;
}
ul.hr li {
display: inline;
font-size: 20px;
color: black;
padding-left: 10px;
position: relative;
}
p,
h2,
h3 {
padding-left: 5px;
}
.logomobile {}
ul.hrmobile li {
display: inline;
font-size: 10px;
text-decoration: none;
}
a {
color: white;
}
a:hover {
color: #c9c9c9;
text-decoration: none;
}
.input {
border: solid 1px #E5E5E5;
font-size: 20px;
width: 60%;
background: -webkit-gradient( linear, left top, left 25, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));
margin-left: 10px;
padding-left: 5px;
}
.shapka .col-md .col-sm {
display: none;
}
.next {
color: black;
}
hr {
border: none;
/* Убираем границу */
background-color: gray;
/* Цвет линии */
height: 1px;
/* Толщина линии */
opacity: 0.2;
}
.map-responsive {
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
height: 0;
}
.map-responsive iframe {
left: 0;
top: 0;
height: 100%;
width: 100%;
position: absolute;
}
<nav class="navbar navbar-expand-lg navbar-light bg-light ">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar" aria-controls="navbarTogglerDemo03" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span></button>
<a class="navbar-brand" href="index.html">BARS</a>
<div class="collapse navbar-collapse opacity-0.5" id="navbar">
<ul class="navbar-nav mr-auto mt-2 mt-lg-0">
<li class="nav-item active border-right-0">
<a class="nav-link" href="index.html">Главная <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Виды ремонта
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
<a class="dropdown-item" href="#">Услуги автосервиса</a>
<a class="dropdown-item" href="#">Ремонт гибридов</a>
<a class="dropdown-item" href="#">Компьютерная диагностика</a>
<a class="dropdown-item" href="#">Сервисное обслуживание</a>
<a class="dropdown-item" href="#">Ремонт инжектора</a>
<a class="dropdown-item" href="#">Ремонт двигателя</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link " href="kakproexat.html">Как проехать</a>
</li>
<li class="nav-item">
<a class="nav-link " data-toggle="modal" data-target="#obratsv" href="#">Обратная связь</a>
</li>
<li class="nav-item d-lg-none d-xs-block">
<a class="nav-link ">Телефон:+79069960426</a>
</li>
<li class="nav-item d-lg-none d-xs-block">
<a class="nav-link ">Адрес: Русская,35</a>
</li>
</ul>
</div>
</nav>
У меня уходит выпадающее меню за блок. Что и как поделать, не знаю. Прилагаю скрин.
Нижний блок перекрывает объекты из верхнего блока с меню. z-index нужно применять именно для родителя, а не выпадающего списка.
.navbar {
z-index: 2;
}
Задай z-index: 1000 выпадающему списку. Но чтобы сказать точнее нужен твой css-код.
Апостиль в Лос-Анджелесе без лишних нервов и бумажной волокиты
Основные этапы разработки сайта для стоматологической клиники
Продвижение своими сайтами как стратегия роста и независимости