Hallo zusammen,
ich sitze seit gestern abend an einer kleinen Website, die ich von Null auf selbst schreibe. Ich habe derzeit ein Problem mit dem horizontalen braunen Menü, welches sich auf schmalen Seiten nicht auf die volle Fensterbreite streckt (z.B. impressum.html).
Kann mir da jemand auf die Sprünge helfen? Habe schon stundenlang Google und auch dieses Forum bemüht, komme aber trotz vielem Ausprobieren nicht auf meinen Fehler.
Meine Impressum-Seite schaut so aus:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="de">
<head>
<title>Robert Kaplan translations - Impressum</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="keywords" lang="de" content="Robert, Kaplan, Übersetzung, Übersetzungen, Englisch, Deutsch">
<meta name="keywords" lang="en-us" content="Robert, Kaplan, translation, translations, english, german">
<link rel=stylesheet type="text/css" href="rkaplan.css">
</head>
<body>
<div>
<img src="http://rkaplan.smfportal.de/rkt.png" alt="Robert Kaplan translations">
<div class=title>
Robert Kaplan translations - Übersetzungen in Deutsch und Englisch<br /><br />
</div>
</div>
<div class=menue-box-1>
<table>
<tr>
<td>
<a class=menue href="index.html">Home</a>
</td>
<td>
<a class=menue href="ich.html">Über mich</a>
</td>
<td>
<a class=menue href="translations.html">Übersetzungen</a>
</td>
<td>
<a class=menue href="kontakt.php">Kontakt</a>
</td>
<td>
<a class=menue href="impressum.html">Impressum</a>
</td>
</tr>
</table>
</div>
<div>
<h2><br />Impressum</h2>
<p>Diese Website ist eine private Website.</p>
<p><h2><br />Disclaimer</h2>
<p>Hier steht der Disclaimer.<br /><br /></p>
</div>
<div class=footer>
<a href="http://validator.w3.org/check?uri=referer">Valid HTML 4.01 Transitional</a>
</div>
</body>
</html>
Und hier die CSS-Datei dazu:
/*
Seitenweite Angaben:
*/
body {
font-family: sans-serif;
font-size: 90%;
float: left;
margin-left: 2cm;
margin-right: 2cm;
margin-top: 1cm;
margin-bottom: 2cm;
}
/*
Verhalten von Links, seitenweit:
*/
a:link, a:active {
color: #8E7960;
font-weight: bold;
text-decoration: none;
}
a:visited {
color: #000;
}
a:hover {
color: #000;
text-decoration: underline;
}
/*
Das horizontale Hauptmenü:
*/
.menue-box-1 {
text-decoration: bold;
background-color: #8E7960;
width: 100%;
}
table {
border-spacing: 0pt;
}
td, th {
height: 40px;
width: 160px;
text-align: center;
font-size: 90%;
}
td:hover, td:active {
background-color: #1F1A17;
}
/*
Verhalten von Links im Menü:
*/
a.menue:link, a.menue:active, a.menue:visited {
color: #FFF;
text-decoration: none;
display: block;
}
/*
Titelzeile oben rechts:
*/
.title {
color: #8E7960;
text-decoration: bold;
position: relative;
top: -6em;
text-align: right;
}
/*
Textliche Formatierungen:
*/
h2 {
border-bottom: 1px dotted #8E7960;
border-right: 1px dotted #8E7960;
}
p {
text-align: justify;
text-indent: 2em;
}
td.text {
vertical-align: top;
text-align: left;
background-color: #FFF;
}
/*
Horizontale Linie:
*/
hr {
color: #8E7960;
height: 2px;
}
/*
Footer:
*/
.footer {
color: #FFF;
background-color: #1F1A17;
text-align: right;
padding: 3px;
}
.footer a {
color: #FFF;
text-decoration: none;
font-size: 70%;
}
.footer a:hover {
text-decoration: underline;
}
Bin für Hilfe sehr dankbar!