2015-04-25 5 views
0

У меня возникли трудности с установкой ссылок в нижней части навигационной панели, как и предполагалось. Ive пытался каждый трюк, о котором я мог думать, у большинства не было видимого эффекта. Одна вещь, которая, казалось, что-то делает, показана ниже в приведенном ниже примере кода, однако она перекрывает все мои ссылки, и я не знаю, как это исправить. Любые советы о том, как исправить этот или лучший способ сделать это, очень ценятся.Выравнивание ссылок в нижней части навигационной панели

<!DOCTYPE html> 
<html> 

<head> 

    <title></title> 

     <style> 
* { 
    margin: 0; 
    padding:0; 
} 

.wrapper { 
    background-color:green; 
    height: 400px; 
} 

.navbar { 
    position: relative; 
    height: 50px; 
} 

.navbar a { 
    position: absolute; 
    bottom: 0; 
} 
     </style> 
</head> 

<body> 
    <div class="wrapper"> 
     <div class="navbar"> 
      <a href="">link</a> 
      <a href="">link</a> 
      <a href="">link</a> 
      <a href="">link</a> 
     </div> 
    </div> 
</body> 
<html> 

ответ

0

css немного лаконичен с позиционированием. Сначала вам нужно предоставить родительскому контейнеру тип позиции. Тогда детские контейнеры будут следовать в зависимости от этого.

* { 
margin: 0; 
padding:0; 
} 

.wrapper { 
    background-color:green; 
    height: 400px; 
    position: relative; 
} 

.navbar { 
    position: absolute; 
    bottom:0; 
    height: 50px; 
} 

.navbar a { 
} 
Смежные вопросы