• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Überschrift

Kingmagister

Neues Mitglied
Hi Leute habe zwei probleme ...

Bei meiner Site wird di Überschrift im content nicht im content angezeigt und die rechte sidebar geht immer nach links?!

Was mache ich falsch ??

Hier die Codes:

HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <title>xxx</title>
  <link rel="stylesheet" type="text/css" href="layout.css">
</head>
<body>
<div class="container">
  <div class="header">
   <table>
    <tr>
     <th align=center > <a href="#"><img src="Logo.jpg" alt="Hier ist das Logo" name="Logo.jpg"  height="194px" style="background: #8090AB; display:block;"></a></th>
     <th width=100%> <span style="font-family:'Times New Roman',Times,serif; font-size:100px"><i>xxx</i></span>
     </th>
    </tr>
   </table>
    <!-- end .header --></div>
  <div class="sidebar1">
    <ul class="nav">
      <li><a href="Startseite.html">Startseite</a></li>
      <li><a href="Über Mich.html">Über Mich</a></li>
      <li><a href="Schule.html">Schule</a></li>
      <li></li>
      <li><a href="Galerie.html">Galerie</a></li>
    </ul>
    <!-- end .sidebar1 --></div>
  <div class="content">
   <h2>
    <span class="thema">HTML</span>
    <span class="artikel">Meine eigene Website</span>
   </h2>
    <!-- end .content --></div>
  <div class="sidebar2">
    <!-- end .sidebar2 --></div>
  <div class="footer">
    <!-- end .footer --></div>
  <!-- end .container --></div>
</body>
</html>

HTML:
.content {
        padding: 10px 0;
        width: 55%;
        float: left;
}
.sidebar2 {
        float: left;
        width: 20%;
        background: #93A5C4;
        padding: 10px 0;
}
 
.content ul, .content ol {
        padding: 0 15px 15px 40px;
}
 
ul.nav {
        list-style: none;
        border-top: 1px solid #666;
        margin-bottom: 15px;
}
ul.nav li {
        border-bottom: 1px solid #666;
}
ul.nav a, ul.nav a:visited {
        padding: 5px 5px 5px 15px;
        display: block;
        text-decoration: none;
        background: #8090AB;
        color: #000;
}
ul.nav a:hover, ul.nav a:active, ul.nav a:focus {
        background: #6F7D94;
        color: #FFF;
}
 
.footer {
        padding: 10px 0;
        background: #6F7D94;
        position: relative;
        clear: both;
}
 
.fltrt {
        float: right;
        margin-left: 8px;
}
 
.fltlft {
        float: left;
        margin-right: 8px;
}
 
.clearfloat {
        clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
}
 
<!-- Hier kommt die CSS für die Überschriften im content -->
h2 {
         font:normal lem/1.2 Verdana, Arial, Helvetica, sans-serif;
         background:#bfbfbf;
         padding:5px;
         position:relative;
}
 
h2 span.thema {
         font:bold 3em Georgia, serif;
         font-variant:small-caps;
         color:#fff;
         position:relative;
}
 
h2 span.artikel {
         font-size 1.2em;
         color:#000;
         position: absolute;
         top: 35px;
         left: 45px;
 
Ich sehe dort folgende Fehler:
- HTML-Fehler: Attribute sind nicht mit Anführungszeichen geschrieben. (align und height in der Tabelle oben)
- HTML-Fehler: Attribut für Höhe enthält "px" -> weg damit, dort ist höchstens % als Einheit zulässig
- CSS-Fehler: in der CSS-Datei steht ein HTML-Kommentar, dadurch wird alles nachfolgende vom Browser nicht mehr interpretiert (deshalb geht auch die Überschrift nicht)
- Hinweis: Dateien sollten weder Umlaute noch Leerzeichen enthalten ("Über mich.html" -> besser: "ueber_mich.html")

Und sidebar2 ist unten, weil sidebar1 so eine große Breite einnimmt. Für mich ist nicht ersichtlich was Du überhaupt dort erreichen willst.
 
Ich sehe dort viele Fehler...

zum ersten machst du keine </div> ändungen, zum zweiten im CSS Code steht

.sidebar2 {
float: left; /* Left = Links & Right = Rechts*/
width: 20%;
background: #93A5C4;
padding: 10px 0;

}
 
Zurück
Oben