nicht angemeldet
So, zu allererst einmal der gesamte Quelltext meines Dokuments (da es noch nicht online ist). Ich habe die CSS-Datei normalerweise ausgelagert, hier allerdings zur besseren Ansicht integriert:
===========================================================
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<meta name="Author" content="Author">
<meta name="description" content="Description">
<meta name="keywords" content="keywords, key, words">
<title>Titel</title>
<style type="text/css">
<!--
body
{
text-align: center; /* Zentrierung im Internet Explorer */
font-family: Arial, Verdana, sans-serif;
font-size: 80%;
color: #000;
background-color: #fff;
margin: 0;
padding: 0;
}
#banner
{
text-align: center;
background-color: #fff;
margin: 10px auto 0;
padding: 0;
}
#content
{
text-align: left; /* Seiteninhalt wieder links ausrichten */
margin: 0 auto; /* standardkonforme horizontale Zentrierung */
padding: 0;
width: 800px;
min-height: 500px;
background-color: #dfd;
background-image: url(bilder/glow_top.PNG);
background-position: top;
background-repeat: repeat-x;
border: 1px solid #0a0;
}
ul#nav
{
font-weight: bold;
float: left;
width: 12em;
margin: 0;
padding: 0;
border-right: 1px solid #0a0;
}
ul#nav li
{
list-style: none;
margin: 0;
padding: 0;
border-bottom: 1px solid #0a0;
}
ul#nav li.current
{
color: #fff;
background-color: #4c4;
text-decoration: underline;
margin: 0;
padding: .3em;
}
ul#nav a
{
display: block;
color: #006;
height: 1.25em;
margin: 0;
padding: .3em;
}
ul#nav a:link, ul#nav a:visited
{
background-color: #afa;
text-decoration: none;
}
ul#nav a:hover, ul#nav a:active
{
background-color: #dfd;
text-decoration: underline;
}
div#main
{
min-width: 25em;
color: #000;
margin: 0;
margin-left: 12em;
padding: 32px 1.5em 2em;
}
* html div#main
{
height: 1em; /* Workaround gegen den 3-Pixel-Bug des Internet Explorer bis Version 6 */
margin-bottom: 0;
}
div#main h1
{
font-size: 1.6em;
font-weight: bold;
text-align: center;
margin: 0 0 1em;
padding: 0;
}
div#main h2
{
font-size: 1.2em;
font-weight: bold;
margin: 0 0 .3em;
padding: 0;
}
div#main h3
{
font-size: 1em;
font-weight: bold;
margin: 1.5em 0 .3em;
padding: 0;
}
div#main h4
{
font-size: 1em;
font-weight: bold;
margin: 0 0 .3em;
padding: 0;
}
div#main a
{
color: #006;
}
div#main a:link, div#main a:visited
{
text-decoration: underline;
}
div#main a:hover
{
text-decoration: none;
}
div#main p
{
margin: 0 0 1.5em;
}
p#fuss
{
clear: both;
font-size: .9em;
text-align: center;
color: #000;
width: 800px;
background-color: #afa;
border-left: 1px solid #0a0;
border-right: 1px solid #0a0;
border-bottom: 1px solid #0a0;
margin: 0 auto;
padding: .3em 0;
}
div#main div#thumb {float:right;border:1px solid #006;margin:1em;margin-right:15px;padding:0;}
div#main div#thumb img {width:320px;height:240px;margin:0;padding:0;}
-->
</style>
</head>
<body>
<div id="banner">
<img src="bilder/banner.PNG" border="0" height="60px" width="802px" alt="Banner">
</div>
<div id="content">
<ul id="nav">
<li class="current">Startseite</li>
<li><a href="angebot.htm" target="_parent" title="Unser Angebot">Angebot</a></li>
<li><a href="kursplan.htm" target="_parent" title="Aktueller Kursplan">Kursplan</a></li>
<li><a href="preise.htm" target="_parent" title="Unsere Preise">Preise</a></li>
<li><a href="anfahrt.htm" target="_parent" title="So finden Sie uns">Anfahrt</a></li>
<li><a href="impressum.htm" target="_parent" title="Zum Impressum">Impressum</a></li>
</ul>
<div id="main">
<h1>Welcome to URI.de</h1>
<div id="thumb">
<img src="bilder/logo.PNG" alt="Logo" title="Logo">
</div>
<p>Text 01: Einleitender, willkommen-heißender Begrüßungstext.<br>
Dieser Text sollte möglichst interessant und mit vielen Adjektiven gespickt sein. Das vermittelt dem Besucher der Webseite direkt einen attraktiven und angenehmen Eindruck.</p>
<h2>Überschrift</h2>
<p>Text 02: Optionale erweiterte Angaben zu welchen Themen auch immer.<br>
Dieser Text könnte z.B. etwas detailliertere Beschreibungen des Unternehmens, bzw. des Angebots oder der Zielgruppe liefern. Diese Informationen sind zwar für eine Startseite relevant, jedoch nicht als allererstes zu nennen. Nur bei wem durch den ersten Absatz Interesse geweckt wurde wird daraufhin hier weiterlesen und sich näher informieren wollen. Wir wollen also die potenziellen Kunden noch weiter von dem Angebot begeistern und sie dazu bringen sich tatsächlich anzumelden.</p>
<p>Dies ist ein Beispiel für einen <a href="" target="_parent" title="Verweis">Link</a> im Inhaltsbereich der Seite</p>
<p>Platz für noch mehr Text</p>
<p>Platz für noch mehr Text</p>
<p>Platz für noch mehr Text</p>
<p>Platz für noch mehr Text</p>
<p>Platz für noch mehr Text</p>
<p>Platz für noch mehr Text</p>
</div>
</div>
<p id="fuss">Anschrift01, Straße Hausnummer, PLZ Ort</p>
</body>
</html>
===========================================================
Also, zu Anfang: Ich bin kein Profi in Sachen HTML.
Meine erste Frage ist wieso mir der W3C Markup Validator sagt "This page is not Valid XHTML 1.0 Transitional!" Oder habe ich den falschen Dokumenttyp gewählt? Welcher wäre korrekt (ich weiß es ist nicht die normale und richtige Vorgehensweise den Dokumenttyp zuletzt zu deklarieren, aber so ist das, wenn man lernt: man erfährt manche Dinge eben erst etwas zu spät ;-) )?
Meine zweite Frage: Wieso zeigt der Internet Explorer unter den beiden Bildern (banner.PNG und logo.PNG) jeweils einen 3px hohen Freiraum? Im Mozilla Firefox wird dieser Freiraum (so wie es auch eigentlich sein soll) nicht angezeigt.
Bitte kommentiert auch andere Mängel, die euch im Dokument auffallen!
Vielen Dank und freundliche Grüße,
blubb76
Der Martin
Marc