nicht angemeldet
Hallo Selfhtml'er.
Vorweg: Ich bin kein geübter Webdesigner, mache das privat und kenne mich nicht großartig aus. Darum bitte bei Erklärungen entweder gleich den neuen Quelltext (sehr praktisch für mich :) ) oder die Lösung mit den in SelfHTML benutzten Fachausdrücken posten, so dass ich alles schnell in SelfHTML finden kann. Danke sehr :)
Ich habe folgendes Formular zur Navigation:
<form><select name="menu" onChange="javascript:parent.location = this.form.menu.options[this.form.menu.selectedIndex].value;">
<option>news</option>
<option value="artists.html">artists</option>
<option value="media.html">media</option>
<option value="contact.html">contact</option>
<option value="forum.html">forum</option>
</select></form>
Meine Seite wird mit diesem Formular aber breiter, so dass in meinem Browser (sowohl Firefox als auch Safari) unten ein unnötiger Scrollbalken erscheint. Ohne dieses Formular passt alles. Da ich aber keine Ansage zur Seitenverbreiterung in diesem Formular gemacht habe nehme ich an dass es am Zusammenspiel mit dem CSS liegt, darum poste ich nochmal den Rest der Seite:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
<html>
<head>
<title>phatbeat.de - news</title>
<link rel="stylesheet" href="style.css" type="text/css">
<style type="text/css">@import("iemac-center.css");</style>
</head>
<body>
<div id="container">
<div id="distance"></div>
<div id="logo"></div>
<div id="menu">
<form><select name="menu" onChange="javascript:parent.location = this.form.menu.options[this.form.menu.selectedIndex].value;">
<option>news</option>
<option value="artists.html">artists</option>
<option value="media.html">media</option>
<option value="contact.html">contact</option>
<option value="forum.html">forum</option>
</select></form>
</div>
<div id="footer"><br><br><br><br>
<img src="images/footer.png" align="center"></img><br><br>
</div>
<div>news<br><br>
</div>
<div id="footer"><br><br><img src="images/footer.png" align="center"></img>
<center><a href=".html">news</a> ::
<a href=".html">artists</a> ::
<a href=".html">media</a> ::
<a href=".html">contact</a> ::
<a href=".html">forum</a></center><br><br><br>
</div>
</div>
</body>
</html>
Hier die CSS-Datei style.css:
body {
background-color: #999966;
font-family: verdana, arial,tahoma;
font-size: 8pt;
text-align:center;
color: #000000;
}
a:link {
font-family: verdana, arial,tahoma;
font-size: 8pt;
color: #cccc99;
text-decoration: none;
}
a:visited {
font-family: verdana, arial,tahoma;
font-size: 8pt;
color: #cccc99;
text-decoration: none;
}
a:hover {
font-family: verdana, arial,tahoma;
font-size: 8pt;
color: #660000;
text-decoration: none;
}
a:active {
font-family: verdana, arial,tahoma;
font-size: 8pt;
color: #660000;
text-decoration: none;
}
a:focus {
font-family: verdana, arial,tahoma;
font-size: 8pt;
background: #660000;
text-decoration: none;
}
#logo {
position:absolute;
left:0px;
top:0px;
width:514px;
height:150px;
z-index:1;
background-image: url(images/logo_small.png);
background-repeat: no-repeat;
}
* {
margin:0;
padding:0;
}
html, body {
height:100%;
}
#distance {
width:1px;
height:180px;
background-color:#999966;
float:left;
}
#container {
margin:0 auto;
position:relative; /* puts container in front of distance */
text-align:left;
width:514px;
clear:left;
background-color:#999966;
}
#container div {
width:514px;
text-align:justify;
}
#menu {
position:absolute;
width:50px;
top:100px;
left:394px;
z-index:2;
}
select {
background-color: #cccc99;
font-family: verdana, arial,tahoma;
font-size: 8pt;
text-align:left;
color: #000000;
width:100;
}
In der Datei iema-ccenter.css steht nur ein kurzer Text für die ältere IE-MAC-Version zur Zentrierung der <div>-Container:
html, body {
height:auto;
}
Falls noch irgendwelche Angaben fehlen, sagt mir Bescheid. Ich hoffe, jemand kann mir helfen.
Dank und Gruß
Nils