HTML/CSS - Website Help -

I am trying to create my first website from scratch. I made fun of design in Photoshop and were trying to change the code for a few hours. But I have not found yet. In fact, I'm stuck on the navigation bar of the header

It looks right, but it does not work. I am using an unordered-inline list, and I'm trying to link different rectangles in the header. I can not click on anything on top, though.

Code for HTML and CSS files, and duplicate of header, are given below.

There is a link to this image:

** Ideally, you either "".

home.html:

  & lt ;! DOCTYPE HTML PUBLIC "- // W3C // DTD XHTML 1.0 Stronger // N http: // www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> & Lt; Html xmlns = "http://www.w3.org/1999/xhtml" lang = "en" xml: lang = "en" & gt; & Lt; Top & gt; & Lt ;! - Title - & gt; & Lt; Title & gt; I am Gabe Oedic. & Lt; / Title & gt; & Lt ;! - Meta - & gt; & Lt; Meta http-equiv = "content-type" content = "text / html; charset = UTF-8" /> & Lt; Meta name = "author" content = "gaade adyak" /> & Lt; Meta name = "copyright" content = "gaade adyak" /> & Lt ;! - stylesheet - & gt; & Lt; Link href = "style.css" media = "screen" rel = "stylesheet" type = "text / css" /> & Lt ;! - RSS - & gt; & Lt; Link rel = "optional" type = "apps / rss + xml" title = "gabeaudick RSS" href = "http://feeds.feedburner.com/gabeaudick" /> & Lt; / Head & gt; & Lt; Body & gt; & Lt ;! - Navigation bar - & gt; & Lt; Div id = "wrap" & gt; & Lt; Div id = "header" & gt; & Lt; Ul & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Previous & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Home & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Next & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt ;! - END - & gt; & Lt ;! - Google Analytics - & gt; & Lt; Script type = "text / javascript" & gt; Var _gaq = _gaq || []; _gaq.push (['_ setAccount', 'UA-XXXXXXXX-X']); _gaq.push (['_ trackPageview']); (Function () {var ga = document.createElement ('script'); ga.type = 'text / javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol? 'Http: //ssl': 'http: // www') + '.google-analytics.com / ga.js'; var s = document.getElementsByTagName ('script') [0]; s.parentNode.insertBefore (GA, S);}) (); & Lt; / Script & gt; & Lt ;! - End of Google Analytics - & gt; & Lt; / Body & gt; & Lt; / Html & gt;  

Style.css:

  * {margin: 0; Padding: 0; Body {background color: #fff; Color: # 000; Font-size: 14px; Font-family: 'Century Gothic', Helvetica, Sense-Serif; Status: Relative; } #wapper {background-color: # 000; Color: #fbaid; Height: 26 pixels; Width: 100%; } #header {background: url (./ images / home.gif) Center again not # 000; Height: 26 pixels; } # Header UL Lee {float: left; List-style-type: none; Margin-right: 12px; Text Indent: -9999px; } #header li a: link, #header li a: visited {outline: none; Display area; Height: 26px; Text Indent: -9999px; }  

Give anchor tag a defined width, the Safari is rendering them with width : More than 0 px.

And just fu, the color #fbead is not a valid color code; #wrap . Besides, why did you position: relative on body tags?