Ich wunder mich immer wieder wie ihr die Codes so locker aus dem Ärmel schütteln könnt. 
Habe alles nochmal umgeschrieben und Buttons mit generiertem Text im Vordergrund eingebaut. Nur gibt es da anscheinend wieder neue Probleme. In der Blcok-Darstellung kann ich so lange mitPadding und Margin sowie width und Height herumspielen bis es in etwa passt. Wobei letztere abstrakte Werte in relation zur eigentlichen Größe der Buttons annehemen.
Inline allerdings wollen die Buttons garnicht ganz dargestellt werden. Es fehlt immer ein Teil davon. Auch eine explizite Höhe für den Menue -Container auszuweisen bringt nichts ausser dass sich die gesamte Seite verzerrt. Ich werde die Buttons eh nochmal neu zeichnen da sie doch arg groß geraten sind.
Hier mal die Index.html und die style.css. An der css kann man sicher noch einiges entschlacken.
<!DOCTYPE html><html><head><title>Orange Goblin´s Portfolio und mehr</title><meta name="description" content="Orange Goblin´s Seite mit Tutorials im bereich CGI, Bildergalerien und so weiter" /><meta name="keywords" content="Cinem4D, C4D, Foto, Galerie, Tutorial" /><meta name="author" content="Patrick" /><meta name="editor" content="html-editor phase 5" /><link rel="stylesheet" href="style.css" type="text/css" /></head><body><div id="toprow"><div id="header"><img src="header3.jpg" alt="Amp" title="AMP" /></div></div><div id="menue"><p> <a href="#">Home</a> <a href="#">News</a> <a href="#">Galerie</a> <a href="#">Tutorial</a> <a href="#">Links</a> <a href="#">Impressum</a> </p><div id="middlerow"><div id="content"><p>Willkommen auf meiner kleinen Homepage. Hier findet ihr Galerien zu den Themen Fotografie und CGI.<br clear="all"/>Außerdem gibt es Tutorials und einen News-Bereich. Des Weiteren wird es irgendwann Musik geben. Das dauert aber noch.</p></div></div></div><div id="bottomrow"><p>Online seit 12.05.2011|letztes Update 16.05.2011|© PatDra 2011</p></div></body></html>
* {
margin: 0;
padding: 0;
border: 5;
}
body {
color: #000;
background: #F56200;
font-size: 1.2em;
font-family: Times New Roman, Arial, sans-serif;
}
#toprow {
width: 100%;
height: 200px;
background: #F56200;
text-align: center;
}
#middlerow {
width: 100%;
height: 499px;
background: #F56200;
text-align: center;
padding: 30px 0 0 0;
}
#menue {
width: 1200px;
margin: 20px;
background: #F56200
}
a {
display:inline;
color:#000;
background-color:#fff;
padding: 25px 56px 56px 56px;
font-size:14px;
font-family:Times New Roman, Arial, sans-serif;
font-weight:bold;
text-decoration:none;
text-align:center;
margin: 6px;
border:none;
background-image:url(button.jpg);
}
a:hover {
display:inline;
color:#fff;
background-color:#000;
background-image:url(buttonon.jpg);
}
#content {
width: 1024px;
height: auto;
background: #FFF;
text-align: center;
margin: auto auto 0 auto;
}
#bottomrow {
width: 100%;
height: 99px;
background: #000;
text-align: center;
border-bottom: 4px solid #191919;
text-align: left;
color: #999;
font-size: 0.8em;
}
Alles anzeigen