Содержимое перекрывается в меню навигации?

У меня есть меню навигации сверху, и содержимое перекрывает меню навигации. Я хочу, чтобы контент находился под панелью навигации. Как это исправить? Помоги мне, пожалуйста?Содержимое перекрывается в меню навигации?

Вот скриншот: http://s1277.photobucket.com/user/fuscia_pink19/media/ss_zps888fc3e9.png.html

Как вы можете видеть AAAA буквы на панели навигации также.

Вот мой код:

<!doctype html> 
<html lang="en"> 
<head> 
<meta charset="UTF-8"> 
<title>Title</title> 
<style> 
body { 
margin: 0; 
padding: 0; 
} 

nav { 
float: right; 
position: absolute; 
top: 28%; 
right: 16%; 
font-size: 20px; 
} 

nav li { 
list-style: none; 
display: inline; 
} 

nav li a { 
text-decoration: none; 
color: #a4d0dd; 
padding: 11px 25px; 
} 

#wrap { 
position: fixed; 
left: 0; 
top: 0; 
background-color: black; 
width: 100%; 
height: 80px; 
border-bottom: 1px solid #444444; 
} 
</style> 
</head> 
<body> 
<div id="wrap"> 

<nav> 
<ul> 
<li> 
<a href="#">Home</a> 
</li> 

<li> 
<a href="#">My Profile</a> 
</li> 

<li> 
<a href="#">Account</a> 
</li> 

<li> 
<a href="#">Logout</a> 
</li> 
</ul> 
</nav> 
</div><!-- ENDING TOP_MENU DIV --> 
<div class="content"> 
a<br /> 

a<br /> 

a<br /> 

a<br /> 

a<br /> 

a<br /> 

</div> 
</body> 
</html>

источник

2013-08-21 Crystal Mae Perez

Избавьтесь от 'position: fixed' в' # wrap'. – putvande

Привет, спасибо за ответ, но я также хочу, чтобы навигация осталась на вершине. Потому что я хочу прокручиваемую навигацию? Как в facebook. –

Снимок экрана отличается от вашего кода. С помощью этого кода содержимое находится за навигацией. – putvande

Чтобы получить содержание «ниже» навигации вам нужно добавить margin-top, который имеет такую же высоту, как и навигационной панели, в данном случае «80px»

Итак, вы добавляете эту строку в свой CSS:

.content { margin-top: 80px; }

источник

2013-08-21 10:11:47 putvande

Содержимое перекрывается в меню навигации?

ответ

Смежные вопросы