Naja alles gut und schön, aber wenn Du es so umsetzen möchtest ist es besser Deine Datei mit Grafik usw. hochzuladen dann kann man auch helfen.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Physiotherapeut Robin Cronenberg - Berlin</title>
<style type="text/css">
-->
@charset "utf-8";
/* CSS Document */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
img{ border:0;}
/*reset styles end*/
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
text-align: center;
background-color: #666666;/* background-image:url(bg.jpg);*//* background-repeat:repeat; */
}
#container {
margin: 0 auto;
width: 716px;
height: 800px;
border: 1px solid black;
background-color: #fff;
}
#header {
background: url(header/header_impressum.jpg) no-repeat;
width: 710px;
height: 138px;
margin: 0 auto;
}
.line {
width: 710px;
height: 3px;
font-size:0;
background: url(line/firstline.gif) no-repeat 0 0;
margin: 1px auto;
}
a {
display: block;
padding: 0px;
height: 20px;
width: 130px;
}
.unsichtbar {
display: none;
}
#navi {
width: 710px;
height: 20px;
margin: 0 auto;
list-style: none;
font-size:0;
}
#navi li {
width: 120px auto;
height: 20px;
display:block;
float: left;
}
#navi li:hover ul, #navi li.hover ul {
display: block;
}
#navlinks {
background:url(navitop/navilinks.gif) no-repeat;
width: 87px;
display: block;
height: 20px;
}
#navi li a.therapien:link, li a.therapien:visited, li a.therapien:focus, li a.therapien:active {
width: 101px;
height: 20px;
display: block;
border: none;
background: url(navitop/therapien.gif) no-repeat;
}
#navi li a.therapien:hover {
background: url(hover_top/therapien.gif) no-repeat;
border: none;
width: 101px;
display: block;
height: 20px;
}
#navi li a.preise:link, li a.preise:visited, li a.preise:focus, li a.preise:active {
width: 101px;
height: 20px;
display: block;
background: url(navitop/preise.gif) no-repeat;
}
#navi li a.preise:hover {
background: url(hover_top/preise.gif) no-repeat;
display: block;
width: 101px;
height: 20px;
}
#navi li a.guestbook:link, li a.guestbook:visited, li a.guestbook:focus, li a.guestbook:active {
width: 101px;
height: 20px;
display: block;
background: url(navitop/guestbook.gif) no-repeat;
}
#navi li a.guestbook:hover {
background: url(hover_top/guestbook.gif) no-repeat;
display: block;
width: 101px;
height: 20px;
}
#navi li a.lebenslauf:link, li a.lebenslauf:visited, li a.lebenslauf:focus, li alebenslauf:active {
width: 120px;
height: 20px;
display: block;
background: url(navitop/lebenslauf.gif) no-repeat;
}
#navi li a.lebenslauf:hover {
background: url(hover_top/lebenslauf.gif) no-repeat;
display: block;
width: 120px;
height: 20px;
}
#navi li a.impressum:link, li a.impressum:visited, li a.impressum:focus, li a.impressum:active {
width: 117px;
height: 20px;
display: block;
background: url(navitop/impressum.gif) no-repeat;
}
#navi li a.impressum:hover {
background: url(hover_top/impressum.gif) no-repeat;
display: block;
width: 117px;
height: 20px;
}
#navrechts {
background:url(navitop/navirechts.gif) no-repeat;
display: block;
width: 83px;
height: 20px;
}
#secondline {
width: 710px;
height: 10px;
background: url(line/secoundline.gif) no-repeat 0 0;
margin: 0 auto;
margin-top: 1px;
}
.thirdline {
width: 710px;
height: 20px;
background: url(line/thirdline.gif) no-repeat 0 0;
margin: 0 auto;
margin-top: 2px;/*border: 1px solid black;*/
}
/* NEU NEU */
#physiotherapie_anschrift {
width: 202px;
text-align:right;
margin-left:60px;
}
#physiotherapie_anschrift ul {
float:left;
list-style:none;
}
#physiotherapie_anschrift li {
display:block;
}
#robincronenberg {
width:230px;
height:60px;
background: url(footer/cronenberg.gif) no-repeat;
}
.invisible {
display:none;
}
#naviunten {
width: 716px;
height: 20px;
margin: 0 auto;
list-style: none;
font-size:0;
border:1px solid black;
float:right;
}
#naviunten li {
width: 140px auto;
height: 20px;
display:block;
float: left;
}
#naviunten li:hover ul, #naviunten li.hover ul {
display: block;
}
#naviiil {
background:url(naviunten/navil.gif) no-repeat;
width: 88px;
display: block;
height: 20px; margin-bottom:0;
}
#naviunten li a.thera:link, li a.thera:visited, li a.thera:focus, li a.thera:active, li a.thera:hover {
width: 86px;
height: 20px;
display: block;
border: none;
background: url(naviunten/therapien.gif) no-repeat;
}
#naviunten li a.preis:link, li a.preis:visited, li a.preis:focus, li a.preis:active, li a.preis:hover {
width: 99px;
height: 20px;
display: block;
background: url(naviunten/preise.gif) no-repeat;
}
#naviunten li a.guest:link, li a.guest:visited, li a.guest:focus, li a.guest:active, li a.guest:hover {
width: 111px;
height: 20px;
display: block;
background: url(naviunten/guestbook.gif) no-repeat;
}
#naviunten li a.leben:link, li a.leben:visited, li a.leben:focus, li a.leben:active, li a.leben:hover {
width: 127px;
height: 20px;
display: block;
background: url(naviunten/lebenslauf.gif) no-repeat;
}
#naviunten li a.imp:link, li a.imp:visited, li a.imp:focus, li a.imp:active, li a.imp:hover {
width: 110px;
height: 20px;
display: block;
background: url(naviunten/impressum.gif) no-repeat;
}
#navr {
background:url(naviunten/navir.gif) no-repeat;
display: block;
width: 84px;
height: 20px;
}
#content {
}
-->
</style>
<!--[if lte IE 6]>
<style type="text/css">
.thirdline {
width: 710px;
height: 20px;
background: url(line/thirdline.gif) no-repeat 0 0;
margin: 0 auto;
margin-top: -7px;
</style>
<![endif]-->
</head>
<body>
<div id="container">
<div id="header"> </div>
<div class="line"> </div>
<div id="navi">
<ul>
<li id="navlinks"></li>
<li><a href="#2" class="therapien" title="Therapien"><span class="unsichtbar">therapienweg</span></a></li>
<li><a href="#3" class="preise" title="Preise"><span class="unsichtbar">preiseweg</span></a></li>
<li><a href="#4" class="guestbook" title="Guestbook"><span class="unsichtbar">guestbookweg</span></a></li>
<li><a href="#5" class="lebenslauf" title="Lebenslauf"><span class="unsichtbar">lebenslaufweg</span></a></li>
<li><a href="#6" class="impressum" title="Impressum"><span class="unsichtbar">impressumweg</span></a></li>
<li id="navrechts"></li>
</ul>
</div>
<div id="secondline"> </div>
<div class="thirdline"> </div>
<div id="content">
<div id="physiotherapie_anschrift">
<ul>
<li><img src="http://home.arcor.de/robertfuhrmann/eco/fonts/impressum.gif" width="202" height="67" title="telefon" alt="telefon" /></li>
<li><img src="http://home.arcor.de/robertfuhrmann/eco/icons/cronenberg_telefon.gif" width="173" height="41" title="telefon" alt="telefon" /></li>
<li><img src="http://home.arcor.de/robertfuhrmann/eco/icons/cronenberg_fax.gif" width="173" height="41" title="fax" alt="fax" /></li>
<li><img src="http://home.arcor.de/robertfuhrmann/eco/icons/cronenberg_mobil.gif" width="173" height="41" title="mobil" alt="mobil" /></li>
<li><img src="http://home.arcor.de/robertfuhrmann/eco/icons/cronenberg_email.gif" width="173" height="41" title="email" alt="email" /></li>
<li><img src="http://home.arcor.de/robertfuhrmann/eco/icons/cronenberg_anschrift.gif" width="173" height="52" title="anschrift" alt="anschrift" /></li>
</ul>
</div>
<div id="robincronenberg"></div>
</div>
<div id="naviunten">
<ul>
<li id="naviiil"></li>
<li><a href="#2" class="thera" title="Therapien"><span class="invisible">therapienweg</span></a></li>
<li><a href="#3" class="preis" title="Preise"><span class="invisible">preiseweg</span></a></li>
<li><a href="#4" class="guest" title="Guestbook"><span class="invisible">guestbookweg</span></a></li>
<li><a href="#5" class="leben" title="Lebenslauf"><span class="invisible">lebenslaufweg</span></a></li>
<li><a href="#6" class="imp" title="Impressum"><span class="invisible">impressumweg</span></a></li>
<li id="navr"></li>
</ul>
</div>
</div>
</body>
</html>
Alles anzeigen
Das ist jetzt nur die Optik für IE8/FF/Opera. Für IE5.5/IE6/IE7 brauche ich das ganze Paket, damit ich etwas sehe.
Sagen wir mal morgen Abend 20:00Uhr. Ob ich heute noch fertig werde kann ich nicht sagen.
Ich hoffe Du kannst etwas damit anfangen:
Eigentlich wollte ich noch eine Alternative mit Containern und reinem CSS anbieten(werde ich bis morgen mittag machen). Den Abstand in der Tabelle habe ich noch nicht wegbekommen und wie ich gerade sehe habe ich geschludert beim slicen.
Hier die noch etwas fehlerhafte Tabellenversion: