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

2 menüs links untereinander

Freaky

Mitglied
Hallo
ich will ein zweites menü unter dem ersten haben links
aber wen ich jetz anfange neues <p> anzufangen dann rutscht es nach rechts aber es bleibt links
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#links{
    float:left;
    margin-left:20px;
    margin-right:20px;
    background-image:url(images/img0012.png);
    background-repeat:repeat-y;
}
#rechts{
    float:right;
    margin-left:20px;
    margin-right:20px;
}
#mitte{
    margin-left:20px;
    margin-right:20px;
    float:inherit;
}
#funktion{
    background-image:url(images/img0012.png);
    background-repeat:repeat-y;
}
li{
    background-image:url(images/img0012.png);
    background-repeat:repeat-y;
}
</style>
</head>

<body>
<div align="center">
  <img src="images/header.png"></img>
    </div>
    <p id="links">
        <img src="images/funktionen.png"/>
        <br />
        <img src="images/pfeil.gif"/><b>Auto Leveln<br />
        <img src="images/pfeil.gif"/>Auto Skills benutzen<br />
        <img src="images/pfeil.gif"/>HP kontrolle<br />
        <img src="images/pfeil.gif"/>MP kontrolle<br />
        <img src="images/pfeil.gif"/>Automatisch aufheben<br />
        <img src="images/pfeil.gif"/>Automatisch laufen<br />
        <img src="images/pfeil.gif"/>Hidde modus</b><br />
    </p>
    <p id="rechts">
        
    </p>
</body>
</html>
 
Werbung:
Also
ich will 2 mnüs haben

________Header__________
Menü 1 | |
________________________
Menü 2 | |
________________________

aber wen ich ein zweites <p> anfange dann siehst es so aus

________Header__________
Menü 1 |Menü2| |
________________________
| |
________________________
 
Werbung:
Erstens baue deine Navigation mit Unordered Lists auf
HTML:
<ul id="links">
      <li><img src="http://www.html.de/images/pfeil.gif"/><b>Auto Leveln</li>
      <li> <img src="http://www.html.de/images/pfeil.gif"/>Auto Skills benutzen</li>
      <li> <img src="http://www.html.de/images/pfeil.gif"/>HP kontrolle</li>
      <li><img src="http://www.html.de/images/pfeil.gif"/>MP kontrolle</li>
      <li> <img src="http://www.html.de/images/pfeil.gif"/>Automatisch aufheben</li>
      <li> <img src="http://www.html.de/images/pfeil.gif"/>Automatisch laufen</li>
      <li><img src="http://www.html.de/images/pfeil.gif"/>Hidde modus</li>
    </ul>

Vielleicht hast du dein links-rechts Problem dann auch nichtmehr.

Ansonsten kannst du in deinem #rechts dieses noch hinzufügen:
Code:
float:left;
clear: left;

Dann hast du deine Zweite Navigation untenlinks.
 
danke klapt
und zu dem <ul>
ich mag so eine tabelle nicht da es ein zu grossen abstandt zwischen den texten hat und disen punkt mag ich auch nicht :D
ich finde mein pfeil viel besser
aber trotzdem danke
 
Gerngeschehen!

Trotzdem tu uns allen einen gefallen und mach es mit <ul>, und <li>.:D Denn das mit den Abständen ist kein Problem, das regelt man so:
Gibmal in deinem CSS Code zuoberst nach dem "<style type="text/css">" folgendes ein:

Code:
* {
  margin:0; 
  padding:0; 
 }

Mit dem * Selektor werden alle HTML Tags angesprochen und auf dem 0 Punkt Formatiert. So nerfst du dich nie mehr ab den vordefinierten Abständen, und bist dem 'Browser Gleichformatierung' Einen grossen Schritt näher gekommen. Denn zb. der Internet Explorer hat andere Vordefinierten Standart Formatierungen der einzelnen Tags als der Firefox.
 
Werbung:
Und die Listenpunkte entfernst du ganz einfach mit
Code:
li {
    list-style:none;
   }
 
und zu dem <ul>
ich mag so eine tabelle nicht da es ein zu grossen abstandt zwischen den texten hat und disen punkt mag ich auch nicht
Das ist an der Stelle irrelevant, was Du magst. Du hast noch keinen Schimmer, wozu HTML überhaupt da ist. Deine Argumentation ist nicht HTML-gerecht.

HTML ist dazu da, die logische Bedeutung des Inhalts zu definieren. Da geht es in keiner Weise um das Aussehen. Man nimmt für eine Menu immer eine Liste (Liste! Nicht Tabelle! Das ist wieder was anderes, etwas zweidimensionales, eine Liste ist eindimensional) und ändert dann das Aussehen nach den eigenen Wünschen.
Abstände, Listenpunkte, all das legt man per CSS fest - für jedes Element.

Also mach aus Deinen Menüs Listen. Derzeit zeichnest Du sie als "Textabsatz" aus, und das ist ja wohl eindeutig falsch!

Eine Änderung musst Du aber trotzdem noch vornehmen...die Images vor Deinen Links. Die dienen dem Aussehen, dem Design. Daher sollten die als background-image per CSS eingebunden werden. Mit <img> zeichnet man nur Bilder aus, die Content besitzen, also wichtig für den Inhalt sind. Bei Dir scheinen das Pfeile zu sein. Die sind nicht wichtig für den Inhalt. Außerdem ist bei <img> das alt-Attribut Pflicht und was würdest Du da als Alternativtext eintragen? Da gibts nichts sinnvolles.

Und eines noch, Du verwendest <b>. Das dient der physischen Inhaltsauszeichnung. HTML macht aber nur die logische Inhaltsauszeichnung, dieses Tag wird also nicht mehr benutzt. Wenn Du etwas fett darsellen willst, und es nur um die Darstellung geht und der fette Text keine besondere Bedeutung haben soll, dann machst Du das mit CSS: font-weight:bold.
Wenn der Text als "wichtig" gekennzeichnet sein soll, gibts dazu das Tag <em>, als "sehr wichtig" gibt es <strong>.
 
Zurück
Oben