@Maxim68

Ошибка в CSS при добавление «>» ничего не происходит как исправить?

Добрый вечер господа, нужна помощь. Ничего не происходит когда прописываю >. Словно такого не существует. Что делаю не правильно? Я новичок во всем этом, не судите строго пожалуйста, только учусь

<section class="main_cats s_black">
		<div class="container">
			<div class="row">
				<div class="col-md-12">
					<h2>Услуги мастерской <strong>Авто</strong><span>Холл</span></h2>
				</div>
			</div>
			<div class="row">
				<div class="col-md-12">
					<ul class="mc_wrap">
						<li class="mc_item_wrap active">
							<div class="mc_item">
								<a href="#">
									<span></span>
									<h4>Кузовной ремонт</h4>
								</a>
								<div class="mc_toggle"></div>
								<ul>
									<li>
										<a href="#">Стапельные работы</a>
									</li>
									<li>						
										<a href="#">Жестяные работы</a>
									</li>
									<li>
										<a href="#">Арматурные работы</a>
									</li>
									<li>						
										<a href="#">Покраска автомобиля</a>
									</li>
									<li>
										<a href="#">Локальная покраска</a>
									</li>
									<li>						
										<a href="#">Покраска мотоцикла</a>
									</li>
									<li>
										<a href="#">Абразивная полировка</a>
									</li>
									<li>						
										<a href="#">Легкая полировка блеск</a>
									</li>
									<li>
										<a href="#">Защитная полировка</a>
									</li>
									<li>						
										<a href="#">Антикоррозийная обработка кузова</a>
									</li>
									<li>
										<a href="#">Удаление вмятин без покраски</a>
									</li>						
								</ul>
							</div>
						</li>
						<li class="mc_item_wrap">
							<div class="mc_item">
								<a href="#">
									<span></span>
									<h4>Механические работы</h4>
								</a>
								<div class="mc_toggle">
								</div>
							</div>
						</li>
						<li class="mc_item_wrap">
							<div class="mc_item">
								<a href="#">
									<span></span>
									<h4>Экспресс-услуги</h4>
								</a>
								<div class="mc_toggle">
								</div>
							</div>
						</li>
						<li class="mc_item_wrap">
							<div class="mc_item">
								<a href="#">
									<span></span>
									<h4>Диагностика</h4>
								</a>
								<div class="mc_toggle">
								</div>
							</div>
						</li>
						<li class="mc_item_wrap">
							<div class="mc_item">
								<a href="#">
									<span></span>
									<h4>Слесарные работы</h4>
								</a>
								<div class="mc_toggle">
								</div>
							</div>
						</li>
						<li class="mc_item_wrap">
							<div class="mc_item">
								<a href="#">
									<span></span>
									<h4>Ремонт пластика</h4>
								</a>
								<div class="mc_toggle">
								</div>
							</div>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</section>


.mc_item {
	border: #353535 1px solid;
	border-radius: 2px;
}
.mc_item_wrap {
	margin-left: 30px;
	width: 160px;
	display: inline-block;
	text-align: center;
}
.mc_item_wrap:nth-child(1) {
	margin-left: 0;
}
.mc_wrap {
	text-align: center;
	padding: 0;
	position: relative;
}
.mc_item_wrap a {
	color: #fff;
}
.mc_item span {
	display: block;
	height: 85px;
	width: 130px;
	background-image: url(../img/cats_iconset.png);
	margin: 15px auto 0px;
	background-repeat: no-repeat;
}
.mc_item_wrap:nth-child(1) span {
	background-position: 16px 0;
}
.mc_item_wrap:nth-child(2) span {
	background-position: -150px 0;
}
.mc_item_wrap:nth-child(3) span {
	background-position: -318px 0;
}
.mc_item_wrap:nth-child(4) span {
	background-position: -484px 0;
}
.mc_item_wrap:nth-child(5) span {
	background-position: -650px 0;
}
.mc_item_wrap:nth-child(6) span {
	background-position: -815px 0;
}
.mc_item h4 {
	font-family: "BebasBold";
	font-size: 20px;
	font-weight: normal;
	margin-top: 5px;
	margin-bottom: 7px;
}
.mc_item a:hover h4,
.mc_item_wrap.active h4 {
	text-decoration: underline;
}
.mc_item_wrap.active,
.mc_item_wrap:hover {
	background-color: #2a2a2a;
}
.mc_toggle {
	background-color: #212121;
	height: 25px;
	cursor: pointer;
	position: relative;
	background-image: url(../img/mc_arr.png);
	background-repeat: no-repeat;
	background-position: 72px 10px;
}
.mc_item_wrap.active .mc_toggle,
.mc_item_wrap:hover .mc_toggle {
	background-color: #353535;
	background-position: -118px 10px;
}
.mc_item_wrap.active > ul {
	position: absolute;
	width: 100%;
}
.mc_item_wrap.active > ul li {
	float: left;
	font-family: "BebasRegular";
}
.mc_item_wrap.active > ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
.mc_item_wrap.active > ul li a {
	padding: 0 20px;
}
  • Вопрос задан
  • 88 просмотров
Решения вопроса 3
Aetae
@Aetae
Тлен
Такого не существует. ¯\_(ツ)_/¯
Ни в одном элементе с классом mc_item_wrap нет прямого потомка с тэгом ul.
Ответ написан
ArsenyMatytsyn
@ArsenyMatytsyn Куратор тега CSS
CEO iAmStudio, предприниматель.
В примере нет потомка, который соответствовал бы комбинатору >.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы