Не работает position:fixed

546

05 августа 2017, 02:41

Столкнулся с тем что не работает position: fixed, перепробовал уже все, вот код в чем может быть проблема?

<!DOCTYPE html> 
<html> 
 
  <head> 
    <link rel="stylesheet" href="style.css"> 
    <script src="script.js"></script> 
    <style> 
      #header{ 
      	position: fixed; 
      	width: 100%;  
      	height: 10rem;  
      	background: rgba(255, 255, 255, 0.8);   
      	left: 0;  
      	top: 0;  
      	box-sizing: border-box;  
      	padding: 0 5rem 0;  
      	display: flex; 
      	justify-content: space-between; 
      	font-family: Sans-serif;  
       
      } 
      .vertical_align_flex{ 
      	align-self: center; 
      } 
      .link_menu{ 
      	margin: 0 1.5rem 0;  
      } 
      #wrap_menu a{ 
      	text-decoration: none;  
      	color: #197B30;  
      	font-size: 2.4rem;  
      	font-weight: 600;  
      } 
      #wrap_menu a:hover{ 
      	border-bottom: 0.2rem solid #197B30;  
      } 
      #wrap_phone div{ 
      	font-size: 2.6rem;  
      	font-weight: 600; 
      } 
      #responsiveMenu{ 
      	display: flex;  
      	flex-wrap: wrap; 
      	transition: 0.5s max-height;  
      	position: static; 
      } 
      .heightreqular{ 
      	 
      } 
      #iconResponsiveMenu{ 
      	display: none;  
      } 
      .font_awesome{ 
      	font-size: 4rem;  
      } 
    </style> 
  </head> 
 
  <body> 
    <header id="header"> 
			<div id="wrap_logo" class="vertical_align_flex"> 
				<img src="image/logo.png"> 
			</div>  
			<div id="wrap_menu" class="vertical_align_flex"> 
				<div> 
					<div id="iconResponsiveMenu"> 
						<em class="fa fa-bars font_awesome"></em> 
					</div> 
					<div id="responsiveMenu" class="heightreqular" > 
						<div class="wraplink_mainMenu" > 
							<a href="#main_page_photo" class="link_menu animatedLink">Главная</a> 
						</div> 
						<div class="wraplink_mainMenu"> 
							<a href="#product" class="link_menu animatedLink">Товары</a> 
						</div>  
						<div class="wraplink_mainMenu">  
							<a href="#about" class="link_menu animatedLink">О фирме</a> 
						</div>  
						<div class="wraplink_mainMenu"> 
							<a href="#footer" class="link_menu animatedLink">Контактные данные</a> 
						</div>  
					</div>  
				</div> 
			</div>  
			<div id="wrap_phone" class="vertical_align_flex"> 
				<div>+ 7 (495) 909-09-09</div> 
			</div> 
		</header> 
  </body> 
 
</html>

P.S. Код вырван из контекста, работать так как надо не будет, но поверьте position: fixed не работает при всех тех стилях и тегах.