Ich sitze derzeit für eine Schulaufgabe, an einer kleinen Website, die wir erstellen sollen. Nichts großes, nur eben ein Thema wählen und ein eigenes Design ausarbeiten. An sich bin ich mit letzterem auch soweit fertig - doch läuft meine Seite nur über den Internet Explorer. An sich ist es keinesfalls gefordert, dass es auch über Firefox bzw. beide laufen soll. Dennoch frage ich mich, was Firefox stört oder fehlt.
Deshalb dachte ich mir, ich frage hier mal nach, ob sich da irgendwer auskennt.
Dringend ist es also auch nicht, zwei Wochen hätte ich eh noch Zeit.
Hier einmal der Inhalt der CSS-Datei.
Und hier noch der Inhalt der eigentliche Seite.<style type="text/css">
<!--
body {
margin:0px;
padding: 0px;
font-family:Verdana;
font-size:14px;
background-color:#000000;
overflow:auto;
}
a:link, a:visited {
text-decoration: none;
}
a:hover; a:active; a:focus {
font-weight:bold;
}
#main {
position:absolute;
width:970px;
height:700px;
margin:10px 0px 0px 20px;
background-color:#7F0000;
}
#header {
position:absolute;
width:950px;
height: 100px;
font-size:20px;
border-style:solid;
border-width:thin;
border-color:#6F6F6F;
margin:15px 0px 0px 10px;
padding:0px;
background-color:#C0C0C0;
background: url(../Bilder/Banner.jpg) no-repeat top center;
}
#menu h1 {
font-family:lucida sans typewriter;
font-size:14px;
text-align:left;
font-weight:bold;
}
#menu h2 {
font-weight:bold;
}
#menu {
position:absolute;
font-family:lucida bright;
font-size:14.5;
width: 200px;
height:500px;
padding:10px 5px 10px 5px;
line-height:1.5;
border-width:medium;
border-style:solid;
margin: 135px 5px 5px 5px;
background-color:#FFFFFF;
background: url(../Bilder/Background Menu.png) no-repeat top center;
}
#content h1 {
font-size:12px;
font-style:italic;
}
#content h2 {
font-size:14px;
}
#content img {
float: right;
clear:bioth;
width:300px;
}
#content {
display:block;
font-size:13px;
overflow:auto;
position:absolute;
width: 560px;
height: 500px;
padding: 10px;
border-width:thick;
border-style:solid;
border-color:#9F9F9F;
margin:135px 5px 5px 230px;
background-color:#FFFFFF;
background: url(../Bilder/Background Content.png) no-repeat top center;
}
#info {
position:absolute;
font-size:12px;
font-style:italic;
overflow:auto;
display:block;
float: right;
width: 150px;
height:500px;
padding:5px;
border-width:medium;
border-style:solid;
margin:135px 5px 5px 800px;
background-color:#C6C3C6;
background: url(../Bilder/Background Info.png) no-repeat top center;
}
#footer {
position:absolute;
font-size:10px;
width: 950px;
height:30px;
margin: 660px 5px 5px 5px;
padding: 2px 5px 2px 5px;
border-width:thin;
border-style:solid;
background-color:#FFFFFF;
background: url(../Bilder/Background Footer.png) no-repeat top center;
}
//-->
</style>
Vielleicht kann ja jemand weiterhelfen. Ich bedanke mich auf jeden Fall schon mal im Voraus.<html>
<head>
<link href="/phpbb/CSS/Style IE.css" rel="stylesheet" type="text/css">
<title>Facharbeit</title>
</head>
<body>
<div id="main">
<div id="header"></div>
<div id="menu">
<h1>Startseite</h1>
<h2>-----</h2>
<h1>Seine Filme</h1>
<li><a href="/">Bube, Dame, König, grAs</a></li><br>
Snatch<br>
Revolver<br>
RockNRolla<br>
Sherlock Holmes<br>
<h2>-----</h2>
<h1>Zukünftige Projekte</h1>
</div>
<div id="content"><img src="/" alt=""><h1>H1</h1>
Normal
<h2>H"</h2>
</div>
<div id="info">Info</div>
<div id="footer"> Schluss!</div>
<div style="clear: both;"></div>
</div>
</body>
</html>
Und ja, beschwer dich ruhig bei deinem Lehrer, denn ich finde, der Inhalt ist wichtiger als die Form. Die CSS-Formatierungen die du benutzt sind schon sehr komplex, dagegen sieht die HTML-Struktur ziemlich rudimentär aus. Mit "Rumspielen" meinte ich auch weniger den Umstand, dass du überhaupt CSS benutzt, sondern eben die Komplexität des Ganzen. Es ist nicht gerade einfach, mehrere DIVs so anzuordnen, dass sie das Tabellendesign vieler Seiten nachahmen können.