mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Di 20.02.2018 02:51 Benutzername: Passwort: Auto-Login

Thema: css horizontales Menü ausrichten vom 15.04.2008


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> css horizontales Menü ausrichten
Autor Nachricht
SCO-Design
Threadersteller

Dabei seit: 21.09.2004
Ort: BLK
Alter: 35
Geschlecht: Männlich
Verfasst Di 15.04.2008 15:22
Titel

css horizontales Menü ausrichten

Antworten mit Zitat Zum Seitenanfang

Hallo,

ich hab ein kleines Problem mit der Ausrichtung eines horizontalen Menüs im Firefox.
Das Menü hat 6 Punkte wobei den Links jeweils eine feste Breite und dem letzen eine Breite von 100%
zugeordnet ist.

Im IE soweit kein Problem aber leider bricht er mir im FF die Liste um und setzt mir den letzen Menüpunkt
bei 100% in eine neue Zeile.

Ich hoffe ich habe mich verständlich ausgedrückt, hier der entsprechende Code.

Code:

<!-- .html -->

<div id="tabsB">
                      <ul>
                        <li><a href="#><span>Punkt 1</span></a></li>
                        <li><a href="#><span>Punkt 2</span></a></li>
                        <li><a href="#"><span>Punkt 3</span></a></li>
                        <li><a href="#"><span>Punkt 4</span></a></li>
                        <li><a href="#"><span>Punkt 5</span></a></li>
                        <li><a href="#"><span>Punkt 6</span></a></li>
                      </ul>
                   
</div>



<!-- .css -->

img {
border: none;
}

#box_menue{
margin:10 0 0 0;
}

 #tabsB {
      height:23;
      background:#ffffff;
      font-family: Geneva, Arial, Helvetica, sans-serif;
      font-size: 11px;
      font-style: normal;
      line-height:normal;
      }

    #tabsB ul {
          position: relative;
     margin:0;
     padding:0px 0px 0 0px;
     list-style:none;
     height: 23; 
      }

    #tabsB li {
      position: relative;
      float:left;
      margin:0;
      padding:0 0 0 0;
      }

    #tabsB a {
      display:block;
      float:left;
      background:url("tableftB.jpg") no-repeat left top;
      margin:0;
      padding:0 0 0 0px;
      font-family: Geneva, Arial, Helvetica, sans-serif;
      font-size: 11px;
      font-style: normal;
      font-weight: normal;
      font-variant: normal;
      text-transform: none;
      text-decoration:none;
      text-align:center;
      border-bottom: 1px solid #bebebe;
      }
   
    #tabsB a.punkt1 {
      width:110;
      background:url(".tableftB.jpg") no-repeat left top;
      margin:0;
      padding:0 0 0 0px;
      text-decoration:none;
      }
    #tabsB a.punkt2 {
      width:120;
      background:url("tableftB.jpg") no-repeat left top;
      margin:0;
      padding:0 0 0 0px;
      text-decoration:none;
      }
    #tabsB a.punkt3 {
      width:120;
      background:url("tableftB.jpg") no-repeat left top;
      margin:0;
      padding:0 0 0 0px;
      text-decoration:none;
      }
    #tabsB a.punkt4 {
      width:120;
      background:url("tableftB.jpg") no-repeat left top;
      margin:0;
      padding:0 0 0 0px;
      text-decoration:none;
      }
    #tabsB a.punkt5 {
      float:left;
      display:block;
      width:100%;
      background:url("tableftB.jpg") no-repeat left top;
      margin:0;
      padding:0 0 0 0px;
      text-decoration:none;
      }

    #tabsB a.punkt6 {
      float:left;
      display:block;
      width:100%;
      background:url("tableftB.jpg") no-repeat left top;
      margin:0;
      padding:0 0 0 0px;
      text-decoration:none;
      }

    #tabsB a span {
      display:block;
      background:url("tabrightB.jpg") no-repeat right top;
      padding:5px 15px 4px 0px;
      color:#000000;
      }
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #tabsB a span {float:none;}
    /* End IE5-Mac hack */
    #tabsB a:hover span {
      color:#000;
      }
    #tabsB a:hover {
      background-position:0% -42px;
      }
    #tabsB a:hover span {
      background-position:100% -42px;
      }




Vielen Dank schonmal

Gruß

sco
  View user's profile Private Nachricht senden
rixxor

Dabei seit: 28.01.2004
Ort: Dortmund
Alter: 32
Geschlecht: Männlich
Verfasst Di 15.04.2008 15:22
Titel

Antworten mit Zitat Zum Seitenanfang

http://css.maxdesign.com.au/listamatic/horizontal01.htm
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
SCO-Design
Threadersteller

Dabei seit: 21.09.2004
Ort: BLK
Alter: 35
Geschlecht: Männlich
Verfasst Di 15.04.2008 15:31
Titel

Antworten mit Zitat Zum Seitenanfang

Danke aber ich glaube damit ist mein Problem mit der Breite von 100% für den letzten
Menüpunkt und den dadurch entstehenden Zeilenumbruch nicht gelöst.
  View user's profile Private Nachricht senden
 
Ähnliche Themen css - horizontales menü, trennstriche
css menü div's hintereinander ausrichten
Horizontales aufklappmenü mit Java/CSS
horizontales scrollen von bildern (css/hmtl)
CSS Menü - Finde nicht das richtige Menü
Spry Menü Text ausrichten
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.