2 menüs nebeneinander

Einklappen
X
Einklappen
 
  • Seite von 1
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge
Vorherige template Weiter
  • #1

    2 menüs nebeneinander

    Hi Leute,

    ich möchte 2 Menüs nebeneinander positionieren mit einen Zwischenraum da zwischen. Das erste Menü funktioniert auch einwandfrei. Nur das 2 Menü beginnt da wo das div logo aufhört,
    obwohl ich es mit in das div logo reingeschrieben haben.
    Hier der Code:

    PHP-Code:
    <html>
    <    head>
    <    title>Startseite</title>
    <    style type="text/css">

    /*Logo*/ 
    #logo
    {
        
            height:175px;
            background-color:#F3DE71;
            background-image: url(title_home.jpg);
            background-repeat:no-repeat;
    }



    div.tabs a 
    {
            border: thin solid black;
            margin-right: 0px;
            padding: 0px 2px;
            color:#000000;
            font-size:16px;
            font-family:verdana,sans-serif;
            font-weight:bold;
            text-decoration:none;
            border: thin solid black;
        
            
    }

    </    style>
    </    head>
    <    body>

    <    div id="logo">


        <    div class="tabs">
            <    div style="padding-left:502px;padding-top:157px;">        
                <    div style="height:22;width:350px; ">
                     <    a href="#item1" class="menu_caption"style="background-color:#FFFFFF;">Startseite</a>
                     <    a href="#item2" class="menu_caption" style="background-color:#3183B4;">Jugendreise</a>
                    <    a href="#item2" class="menu_caption" style="background-color:#86AB37;">Service</a>
                    <    a href="#item2" class="menu_caption" style="background-color:#AD0000;">News</a>
                </    div>
            </    div>
        
            <    div style="padding-top:157px;">        
                <    div style="height:22;width:350px; ">
                     <    a href="#item1" class="menu_caption"style="background-color:#FFFFFF;">geht nicht</a>
                     <    a href="#item2" class="menu_caption" style="background-color:#3183B4;">geht nicht</a>
                    <    a href="#item2" class="menu_caption" style="background-color:#86AB37;">geht nicht</a>
                    <    a href="#item2" class="menu_caption" style="background-color:#AD0000;">geht nicht</a>
                </    div>
            </    div>

        </    div>
    </    div>

    </    body>
    </    html> 
    Also das 2. Menü ist jetzt 157px unterhalb von div logo!

    Was mache ich falsch?

    MFG
    Stichworte: -
  • #2
    du floatest nicht!

    peter
    Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
    Meine Seite

    Kommentar

    • #3
      ok danke, habe es nun gemacht!
      Nur leider habe ich jetzt im IE ein weiteres Problem siehe Bild

      Code:

      PHP-Code:
      <html>
      <      head>
      <      title>Startseite</title>
      <      style type="text/css">

      /*Logo*/ 
      #logo
      {
          
                height:178px;
                background-color:#F3DE71;
                background-image: url(title_home.jpg);
                background-repeat:no-repeat;
      }



      div.tabs a 
      {
                border: thin solid black;
                margin-right: 0px;
                padding: 0px 2px;
                color:#000000;
                font-size:16px;
                font-family:verdana,sans-serif;
                font-weight:bold;
                text-decoration:none;
                border: thin solid black;
          
              
      }

      </      style>
      </      head>
      <      body style="font-size:16px;font-family:verdana,sans-serif;">

      <      div id="logo">


          <      div class="tabs">

          
              <      div style="padding-top:156px; float:left;">        
                  <      div style="height:22;width:400px; ">
                       <      a href="#item1" style="background-color:#FFFFFF;">geht nicht</a>
                       <      a href="#item2" style="background-color:#3183B4;">geht nicht</a>
                      <      a href="#item2" style="background-color:#86AB37;">geht nicht</a>
                      <      a href="#item2" style="background-color:#AD0000;">geht nicht</a>
                  </      div>
              
              </      div>

                  <      div style="padding-top:156px; float:left; padding-left:150px">
                      <      div style="height:22;width:400px;">
                       <      a href="#item1"  style="background-color:#FFFFFF;">Startseite</a>
                       <      a href="#item2"  style="background-color:#3183B4;">Jugendreise</a>
                      <      a href="#item2"  style="background-color:#86AB37;">Service</a>
                      <      a href="#item2"  style="background-color:#AD0000;">News</a>
                  </      div>    
              </      div>
              
          </      div>
      </      div>

      </      body>
      </      html> 
      Angehängte Dateien

      Kommentar

      • #4
        keine doctype angegeben, siehe darstellungsmodi und das fehlerhafte boxmodell des ie (unten). am besten liest du dir mal alles zur theorie von html und css. danach setzt du dich an die tutorials. danach sollte das notwendige grundwissen vorhanden sein.

        und bitte vermeide die inline-styles wie
        PHP-Code:
        <div style="padding-top:156px; float:left;"> 
        und wenn du mit größenangaben arbeitest, so mache setze doch bitte auch die maßeinheit:
        PHP-Code:
        <div style="height:22;width:400px; "> 
        22 was? äpfel?

        gruß
        peter
        Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
        Meine Seite

        Kommentar

        Vorherige template Weiter
        Lädt...
        X