Вертикально выровнять изображение рядом с встроенной навигационной панелью ul

Question

Кто-то, должно быть, уже сделал это, но я ничего не пробовал, включая фоновые изображения и даже столы.

У меня есть 960 пикса широкой обертка, и в настоящее время код у меня отображает заголовок на ту же линию, как ули панель навигации:

____________________________________________________________ 
!   h2 text   ! menu1 ! menu 2 ! menu3 ! 
____________________________________________________________ 

Я хочу, чтобы заменить текст h2 с логотипом, который является выше текущей строки текста и выравнивают все на дно, как это:

___________________________ 
!       !  
!  LOGO.jpg   ! 
!       !________________________________ 
!       ! menu1 ! menu 2 ! menu3 ! 
____________________________________________________________ 

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

____________________________________________________________ 
!       ! menu1 ! menu 2 ! menu3 ! 
!  LOGO.jpg   !_______________________________! 
!       ! 
!       ! 
___________________________! 

На данный момент у меня есть этот код:

#header { 
position: relative; 
display: block; 
background-color: #003366; 
} 


#header ul { 
position: absolute; 
right: 0px; 
top: 2px; 
} 

#header ul li { 
list-style: none; 
display: inline; 
} 

img.bottom 
    { 
vertical-align:text-bottom; 
    } 

и

<div id="header"> 
<img src="src/logo.jpg" width="414" height="140" class="bottom" /> 
    <div id="navbar"> 
      <ul>    
<li><a href="menu1.htm"><span>Home</span></a></li> 
<li><a href="menu2.htm"><span>About</span></a></li> 
<li><a href="menu3.htm"><span>Contact</span></a></li> 
     </ul> 
</div> 
    </div> 

есть простой способ сделать движение этого меню вниз, чтобы она совпадала с нижней частью JPG ?

Answer 1

Вы можете установить высоту заголовка в положение auto и поместить позицию ul вниз. Вот jsfiddle: http://jsfiddle.net/YBrkB/