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

Text neben Menü

Status
Für weitere Antworten geschlossen.

Ettiene

Neues Mitglied
Nun, ich hab es endlich geschafft ein menü erstellen, aber das problem ist das wenn ich jetzt text daneben haben will erscheint der text sozusagen im menü (auch wenn ich es mit </div> und so schließe)

Übrigens, css hab ich auch benutzt, float:left nützt aus irgendeinem grund nichts.

Ich poste einfach mal beide Codes:
HTML:
Code:
<html>
  
  <head>
    <title>Black Skill - Index</title>
    <link rel="stylesheet" type="text/css" href="../style/style.css" />
  </head>
  
  <body>

  <img src="../style/header.jpg">

  <div id="menu1">
  <h3>Menü</h3>
  <div id="menu">
  <ul align="left">
  <li><a href="Index.htm">Home</a></li>
  <li><a href="http://zelda-tp.chapso.de/">Zelda-TP</a></li>
  </ul>
  </div>
  
  </body>

</html>
CSS:
Code:
body {
    background-image: url("hintergrundbild.jpg");
}

a:link {
    color: #FFFFFF;
}

a:visited {
    color: #C0C0C0;
}

a:active {
    background-color: #FFFFFF
}


body {
    margin-top: 0%;
    margin-right: 20%;
    margin-bottom: 0%;
    margin-left:  20%;
}

#menu {
  background-image: url("menuhintergrund.jpg");
  width: 200px;
  font-size: 20px;
  float: left;
}

#menu1 {
  color: white;
  background-color: black;
  font-size: 20px;
  padding-left: 30px;
  width: 200px;
  float: left;
}
Manche Stellen sind vieleicht nicht wichtig aber ich wollte besser mal alles posten.
 
Werbung:
Du hast zunächst "#menu1" geöffnet und anschließend "#menu".
Geschlossen hast du aber lediglich einmal, nämlich "#menu".
Also musst du auch noch #menu1 schließen, sonst steht der Text da drin.

Schreibe den Text dann am besten in einen neuen div, z.B. #content. Dieser benötigt einen Linksabstand von mindestens der Gesamtbreite von #menu1 (hier 10px mehr wegen Abstand):

Code:
#content {margin-left: 240px;}
<div id="menu1">
<h3>Menü</h3>
<div id="menu">
<ul align="left">
<li><a href="Index.htm">Home</a></li>
<li><a href="http://zelda-tp.chapso.de/">Zelda-TP</a></li>
</ul>
</div> </div>
<div id="content">Text</div>

Gib deinen Seiten auch unbedingt noch einen Doctype, indem du z.B. den in die allererste Quelltextzeile, ganz oben hin schreibst:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">
Andernfalls kann der Internet Explorer das CSS-Boxmodell nicht korrekt darstellen.
 
Du solltest Dir ausßerdem angewöhnen, alles, was mit Layout und Design zu tun hat, ins Stylesheet auszulagern. Mal was mit CSS zu machen und dann wieder, wie in der Liste mit dem Attribut "align" zu arbeiten ist inkonsequent und macht Dir die Arbeit nur unnütz schwer.

Abgesehen davon hast Du das div#menu dazu benutzt, das einzelne Element ul zu gruppieren. Zum Gruppieren brauchts aber mindestens 2 Elemente, das <div> kannst Du Dir also sparen. div und ul sind beides Block-Elemente, verhalten sich also auch gleich. Im Moment ist es so, wie wenn Du ein Geschenk zweimal einpacken würdest :-)

Grüße,
-Efchen
 
Werbung:
Status
Für weitere Antworten geschlossen.
Zurück
Oben