@Nikitos08

Как убрать границу (разделитель) у всех вложенных пунктах списка?

Уважаемые знатоки нужно , что бы вложенные пункты били без границы слева с первым элементном списка я разобрался ,а вот остальные....
HTML менюшки:

<ul id="main-menu">
				<li><a href="/">Главная</a></li>
				<li>
				
				<a href="/about">О компании</a>
				
					<ul>
						<li><a href="/our-manufacturing">Наше производство</a></li>
						<li><a href="/cooperation">Сотрудничество</a></li>
						<li><a href="/guarantee-сertificates">Гарантия, Сертификаты</a></li>
						<li><a href="/news">Новости</a></li>
						<li><a href="/our-clients">Наши клиенты</a></li>
					</ul>
					
				</li>	
				<li><a href="/about-technology">О технологии</a></li>
				<li><a href="/objects">Обьекты</a></li>
				<li><a href="/goods_caregory/all/">Проекты</a></li>
				<li>
				<a href="/services">Услуги</a>

					<ul>
						<li><a href="/calculate-project">Рассчитать проект</a></li>
						<li><a href="/individual-project">Индивидуальный проект</a></li>
						<li><a href="/landscaping">Ландшафтный дизайн</a></li>

					</ul>
				
				</li>
				<li>
				<a href="">Цены</a>
					<ul>
						<li><a href="/domokomplekt">Домокомплект</a></li>
						<li><a href="/box-house">Коробка дома</a></li>
						<li><a href="/turnkey">Под ключ</a></li>

					</ul>
				</li>
				<li><a href="/contacts">Контакты</a></li>
			</ul>


CSS:

#main-menu {
	position: relative;
	padding: 0;
	margin-top: 15px;
	float: right;
	font-size: 14pt;
}	

#main-menu ul {
	overflow: hidden; 
	zoom: 1;
}
#main-menu li {
	list-style: none; 
	float: left; 
	border-left: 1px solid #BCBCBC; 
	padding: 0 20px; 
	margin: 0 1px 0 -1px;
	position: relative;
	z-index: 2;
	

}

#main-menu li ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: none;
	position: absolute;
	left: 0;
	}

#main-menu li ul li {
	float: none;
	margin: 0;
	text-align: left;
	font-size: 11pt;
	background: #fff;
	width: 130px;
	padding-top: 3px;
	padding-bottom: 3px;
	}
#main-menu li a {
	display: block;
	color: #333333;
	text-decoration: none;
	}
#main-menu li a:hover {
	color: #b2b935;
	text-decoration: none;
	}	
	
#main-menu li:hover ul, #menu li.jshover ul {
	display: block;
	border-radius: 10px;
	box-shadow: 0 5px 5px #b7b7b7;
	z-index: 2;
	
}

#main-menu li:first-child {
            border: inherit;
}

#main-menu .Active {
  	color: #b2b935;
}
  • Вопрос задан
  • 2679 просмотров
Решения вопроса 1
TheExplay
@TheExplay
Верстальщик - Junior FrontEnd
Я правильно понял, что полоску надо убрать, но тень оставить? если да, то держите
jsfiddle.net/tu27hj7L
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
tennalian
@tennalian
именно вложенных? ul li > ul li {border: 0;} попробуйте
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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