2013-06-04 3 views
0

Я стараюсь сделать свой блог отзывчивым, но мое меню навигации находится за заголовком, я хочу сделать его перед моим названием. Вы можете посмотреть на экран печати здеськак сделать панель навигации (отзывчивая) перед заголовком

print-screen

и вот код нав по запросу средств массовой информации;

.nav { 
max-width:599px; 
position: relative; 
float:center; 
padding-bottom:120px; 
top:159px; 
left:-60px; 
min-height: 40px; 
padding-top:0; 
} 

.nav ul { 
/*width: 599px;*/ 
padding: 5px 0; 
position: absolute; 
/*top: -13px; 
left: -95px;*/ 
border: solid 1px #2FB8C8; 
background: #2FB8C8 url(../images/icon-menu.png) no-repeat 10px 11px; 
} 

.nav li { 
display: none; /* hide all <li> items */ 
margin: 0; 
opacity:0.8; 
} 

.nav .current { 
display: block; /* show only current <li> item */ 
} 

.nav a { 
display: block; 
padding: 5px 5px 5px 32px; 
text-align: left; 
width:599px; 
} 

.nav .current a { 
background: none; 
color: #666; 
} 

/* on nav hover */ 
.nav ul:hover { 
opacity:1; 
} 

.nav ul:hover li { 
display: block; 
margin: 0 0 5px; 
} 

.nav ul:hover .current { 
background: url(../images/icon-check.png) no-repeat 10px 7px; 
} 

заранее спасибо за вашу помощь

ответ

0

Вы можете установить Z-индекс явно довести эти элементы вперед.

0
.nav { 

z-index:2 

max-width:599px; 
position: relative; 
float:center; 
padding-bottom:120px; 
top:159px; 
left:-60px; 
min-height: 40px; 
padding-top:0; 
} 

.Title{ 
/*or what ever you gave it*/ 
z-index:1; 
} 
+0

я должен использовать Z-индекс, но он не работает .. спасибо за вашу помощь в любом случае .. – auliarahmani

+0

ли вы дать логотип позицию? Поскольку это не работает, если позиция статична – DiederikEEn

0

Проверьте следующие ссылки для вашего проводника. Вам также нужно использовать jQuery.

http://tympanus.net/codrops/2013/04/19/responsive-multi-level-menu/ 
http://webdesignerwall.com/demo/responsive-menu/ 
http://www.hongkiat.com/blog/responsive-web-nav/ 
Смежные вопросы