Почему следующий блок залезает на слайдер (предыдущий блок)?

Question

[hellen_fisher]

Здравствуйте! У меня такая проблема - на слайдер залез следующий за ним блок на самый верх слайдера.
Инспектор показывает, что высота слайдера = 0. Я так понимаю, что именно поэтому такое смещение блока.
Перед слайдером было меню с применением float: right;

Что делать мне? уже голова трещит, всякие clear: both не помогают :(

Answer 1

[Stimulate]

overflow: hidden

Comments

[hellen_fisher]

не помогло тоже

[Stimulate]

hellen_fisher, Тогда верстку в студию

[hellen_fisher]

Тут еще position: absolute; мешается...Когда убираю, то блок становится на свое место, но это для слайдов. Я не могу это убрать. Ну вообщем, вот код: (блок type_services залезает на слайдер)

<header class="main_menu">
	<div class="top_line">		
		<div class="center">
			<a href="index.html" class="logo">FitnessTime</a>
			<div class="right_side">
				<nav>
					<ul>
						<li><a href="#" class="active">Home</a></li>
						<li><a href="#">Features</a></li>
						<li><a href="#">OUR TEAM</a></li>
						<li><a href="#">gallery</a></li>
						<li><a href="#">pricing</a></li>
						<li><a href="#">partners</a></li>
						<li><a href="#">contact</a></li>
					</ul>
				</nav>
			</div>
		</div>		
	</div>
</header>
<section class="slider">
	<ul>
		<li>
			<img src="img/slide_1.jpg" alt="слайд 1">
			<div class="center">
				<div class="slider_text">
					<a href="#" class="example">landing page template</a>
					<p>PERFECT Fitness SOLUTION</p>
					<ins>best choise for your site</ins>
				</div>
			</div>
		</li>
		<li>
			<img src="img/slide_2.jpg" alt="слайд 2">
			<div class="center">
				<div class="slider_text">				
					<a href="#" class="example">landing page template</a>
					<p>PERFECT Fitness SOLUTION</p>
					<ins>best choise for your site</ins>		
				</div>
			</div>
		</li>			
	</ul>		
	<button class="prev"></button>
	<button class="next"></button>		
</section>	

<section class="type_services">
	<div class="center">
		<ul class="service">
			<li>
				<div class="ico"><img src="img/ico1.png" alt=""></div>
				<span>strength training</span>
				<p>Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus.</p>
				<p>Maecenas mattis vitae tellus vel interdum. Quisque lacinia mauris id convallis pretium. Aliquam id odio sit amet mauris porttitor iaculis a eu dui. </p>
			</li>
			<li>
				<div class="ico"><img src="img/ico2.png" alt=""></div>
				<span>strength training</span>
				<p>Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus.</p>
				<p>Maecenas mattis vitae tellus vel interdum. Quisque lacinia mauris id convallis pretium. Aliquam id odio sit amet mauris porttitor iaculis a eu dui. </p>
			</li>
			<li>
				<div class="ico"><img src="img/ico3.png" alt=""></div>
				<span>strength training</span>
				<p>Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus.</p>
				<p>Maecenas mattis vitae tellus vel interdum. Quisque lacinia mauris id convallis pretium. Aliquam id odio sit amet mauris porttitor iaculis a eu dui. </p>
			</li>
		</ul>
	</div>
</section>

.center{
 	max-width: 1180px;
 	min-width: 320px;
 	margin: 0 auto;
 	padding: 0 5px;
}

.main_menu .top_line{
 	background: #202020;
 	padding: 38px 0px;
}

.main_menu .top_line a.logo{
 	display: inline-block;
 	vertical-align: top;
 	color: #fefefe;
 	font-size: 24px;
 	font-family: 'raleway-extrabold';
 	text-decoration: none;
}

.main_menu .top_line .right_side{
 	float: right;
 	margin-top: 6px;
}

.main_menu .top_line .right_side nav ul li{
 	display: inline-block;
 	vertical-align: top;
 	margin-left: 7px;
}

.main_menu .top_line .right_side nav ul li a{
 	font-family: 'oswald-regular';
 	font-size: 15px;
 	color: #fefefe;
 	text-transform: uppercase;
 	text-decoration: none;
 	padding: 6px 14px;
}

.main_menu .top_line .right_side nav ul li a.active{
 	background: #e25050;
}

.slider ul li{
 	opacity: 0;
 	position: absolute;
 	top: 0;
 	right: 0;
 	bottom: 0;
 	top: 0;
 	margin: auto;
 	transition: .4s;
}

.slider ul li.active{
 	opacity: 1;
}

.slider ul li img{
 	width: 100%;
}

.slider .center{
 	position: absolute;
 	top: 0;
 	left: 0;
 	bottom: 0;
 	margin: auto;
 	right: 0;
}

.slider .center .slider_text{
 	position: absolute;
 	margin-top: 87px;
 	left: 0;
 	margin-left: 11px;
 	width: 370px;
 	height: 150px;
}

.slider .center .slider_text a{
 	background: #d34f4e;
 	display: inline-block;
 	padding: 11px 17px 11px 13px;
 	color: #fefefe;
 	font-size: 12px;
 	text-transform: uppercase;
 	font-family: 'oswald';
 	word-spacing: 2px;
 	text-decoration: none;
 	opacity: 0.9;
}

.slider .center .slider_text p{
 	font-size: 30px;
 	color: #fefefe;
 	background: #252423;
 	opacity: 0.9;
 	font-family: 'oswald-bold';
 	text-transform: uppercase;
 	padding: 20px 21px 17px 22px;
 	word-spacing: 1px;
 	margin-top: 1px;
}

.slider .center .slider_text ins{
 	font-size: 18px;
 	color: #fefefe;
 	font-family: 'oswald';
 	background: #272625;
 	opacity: 0.9;
 	text-transform: uppercase;
 	padding: 15px 25px 12px 24px;
 	margin-top: 1px;
 	word-spacing: 4px;
}

.slider button{
 	width: 40px;
 	height: 40px;
 	border-radius: 50%;
 	background-color: #202020;
 	position: absolute;
 	margin-top: 10%;
 	border: 0;
 	display: block;
 	transition: .2s;
}

.slider button.prev{
 	left: 0;
 	background: url('../img/prev.png')no-repeat center #202020;
}

.slider button.next{
 	right: 0;
 	background: url('../img/next.png') no-repeat center #202020;
}

.slider button:hover{
 	background-color: #d34f4e;
 	opacity: 0.9;
}

.type_services .center ul li{
 	width: 346px;
 	display: inline-block;
 	vertical-align: top;
 	text-align: center;
}

[Stimulate]

hellen_fisher, мэм, я думал будет jsfiddle или, тем паче, демо

[hellen_fisher]

Stimulate, нету демо, сайт не выгружен