ヘッダ 04

--- HTML ---
<div id="header">
 <h1>タイトル</h1>
 <ul>
 <li>サブタイトル</li>
 <li><a href="">link-a</a>|<a href="">link-b</a></li>
 </ul>
 <div>
 <a href="">MENU1</a>
 <a href="">MENU2</a>
 <a href="">MENU3</a>
 <a href="">MENU4</a>
 <a href="">MENU5</a>
 </div>
</div>

--- CSS ---
#header {
 width:800px;
 min-height:47px;
 height:auto !important;
 height:47px;
}

#header h1 {
 margin:0;
 padding:10px 10px 15px;
 font-size:120%;
 float:left;
 line-height:1em;
}

#header ul {
 margin:0;
 padding:8px 10px 3px 10px;
 font-size:70%;
 text-align:right;
}

#header li {
 margin:0 0 5px 0;
 line-height:1.32em;
}

#header div {
 min-height:16px;
 height:auto !important;
 height:16px;
 padding:5px 0;
 color:#fff;
 background:#336699;
 font-size:80%;
 text-align:left;
 line-height:1.32em;
 clear:both;
}

#header a {
 color:#3366cc;
 text-decoration:none;
}

#header a:hover {
 color:#cc0000;
}

#header div a {
 padding:5px 10px;
 color:#fff;
}

#header div a:hover {
 padding:6px 10px;
 color:#fff;
 background:#003366;
}