Ergebnis 1 bis 5 von 5

Thema: Navbar dropdown nebeneinander nicht untereinander

  1. #1
    Unregistriert
    Gast

    Standard Navbar dropdown nebeneinander nicht untereinander

    Hallo,

    Ich hab mit cssmenumaker.com ein Navigationsmenü erstellt und dann versucht die unterpunkte nebeneinander dastellen zu lassen.
    Leider habe ich das nicht geschafft. Mir fehlen zudem css kenntnisse und wollte mal fragen ob ihr mir dabei helfen könnt.

    CSS-Code:
    #cssmenu ul,
    #cssmenu li,
    #cssmenu span,
    #cssmenu a {
    margin: 0;
    padding: 0;
    position: relative;
    }
    #cssmenu {
    height: 49px;
    border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
    background: #141414;
    background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
    background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
    background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
    background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
    background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
    filter: progid:DXImageTransform.Microsoft.Gradient(StartCo lorStr='#32323a', EndColorStr='#141414', GradientType=0);
    border-bottom: 2px solid #e00f16;
    }
    #cssmenu:after,
    #cssmenu ul:after {
    content: '';
    display: block;
    clear: both;
    }
    #cssmenu a {
    background: #141414;
    background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
    background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
    background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
    background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
    background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
    filter: progid:DXImageTransform.Microsoft.Gradient(StartCo lorStr='#32323a', EndColorStr='#141414', GradientType=0);
    color: #ffffff;
    display: inline-block;
    font-family: Helvetica, Arial, Verdana, sans-serif;
    font-size: 11px;
    line-height: 49px;
    padding: 0 20px;
    text-decoration: none;
    }
    #cssmenu ul {
    list-style: none;
    }
    #cssmenu > ul {
    float: left;
    }
    #cssmenu > ul > li {
    float: left;
    }
    #cssmenu > ul > li:hover:after {
    content: '';
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    left: 50%;
    bottom: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #e00f16;
    margin-left: -10px;
    }
    #cssmenu > ul > li:first-child > a {
    border-radius: 5px 0 0 0;
    -moz-border-radius: 5px 0 0 0;
    -webkit-border-radius: 5px 0 0 0;
    }
    #cssmenu > ul > li:last-child > a {
    border-radius: 0 5px 0 0;
    -moz-border-radius: 0 5px 0 0;
    -webkit-border-radius: 0 5px 0 0;
    }
    #cssmenu > ul > li.active > a {
    box-shadow: inset 0 0 3px #000000;
    -moz-box-shadow: inset 0 0 3px #000000;
    -webkit-box-shadow: inset 0 0 3px #000000;
    background: #070707;
    background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
    background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
    background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
    background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
    background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
    filter: progid:DXImageTransform.Microsoft.Gradient(StartCo lorStr='#26262c', EndColorStr='#070707', GradientType=0);
    }
    #cssmenu > ul > li:hover > a {
    background: #070707;
    background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
    background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
    background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
    background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
    background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
    filter: progid:DXImageTransform.Microsoft.Gradient(StartCo lorStr='#26262c', EndColorStr='#070707', GradientType=0);
    box-shadow: inset 0 0 3px #000000;
    -moz-box-shadow: inset 0 0 3px #000000;
    -webkit-box-shadow: inset 0 0 3px #000000;
    }
    #cssmenu .has-sub {
    z-index: 1;
    }
    #cssmenu .has-sub:hover > ul {
    display: block;
    }
    #cssmenu .has-sub ul {
    display: none;
    position: absolute;
    width: 100px;
    top: 100%;
    left: 0;
    }
    #cssmenu .has-sub ul li {
    *margin-bottom: -1px;
    }
    #cssmenu .has-sub ul li a {
    background: #e00f16;
    border-bottom: 1px dotted #ec6f73;
    filter: none;
    font-size: 11px;
    display: block;
    line-height: 120%;
    padding: 10px;
    }
    #cssmenu .has-sub ul li:hover a {
    background: #b00c11;
    }
    #cssmenu .has-sub .has-sub:hover > ul {
    display: block;
    }
    #cssmenu .has-sub .has-sub ul {
    display: none;
    position: absolute;
    left: 100%;
    top: 0;
    }
    #cssmenu .has-sub .has-sub ul li a {
    background: #b00c11;
    border-bottom: 1px dotted #d06d70;
    }
    #cssmenu .has-sub .has-sub ul li a:hover {
    background: #80090d;
    }



    Habe gelesen dass es mit block und inline zu tun haben könnte aber Änderungen haben nur Verschlechterung gebracht.
    Hoffe auf eure Hilfe

    Der Unbekannte
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Bandit
    Gast

    Standard AW: Navbar dropdown nebeneinander nicht untereinander

    Es wäre deutlich sinnvoller, wenn du das online stellst und einen Link postest.

  3. #3
    Unregistriert
    Gast

    Standard AW: Navbar dropdown nebeneinander nicht untereinander

    Hab hier mal das Grundgerüst hochgeladen. Hatte vorhin nur vergessen den link einzufügen.

    www.mrc-studio.de

    sorry.

  4. #4
    Bandit
    Gast

    Standard AW: Navbar dropdown nebeneinander nicht untereinander

    Solange das

    http://validator.w3.org/check?verbos...c-studio.de%2F

    und das

    http://jigsaw.w3.org/css-validator/v...c-studio.de%2F

    nicht bereinigt ist, sollte man nicht solche Fehler suchen.

  5. #5
    Unregistriert
    Gast

    Standard AW: Navbar dropdown nebeneinander nicht untereinander

    Hi,

    also was der erste Link anzeigt ist lustigerweise total falsch. Ich geb zu ich hab nicht jeden einzelnen Fehler gesucht. der erste war vorhanden aber das wars dann auch schon. alle < oder > sind definitiv vorhanden in meiner Datei. Verstehe das einfach nicht.

    Was den zweiten angeht, den habe ich aus dem im ersten post genannten generator direkt übernommen, ohne jegliche änderungen.

    Naja, vllt. doch besser wenn ich die Seite jemand machen lasse der das evtl. beruflich macht.


    Dennoch danke.

Ähnliche Themen

  1. Antworten: 6
    Letzter Beitrag: 02.02.2012, 00:16
  2. Vier DIVs nebeneinander? (nicht untereinander)
    Von Neku im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 08.03.2010, 13:02
  3. Posts statt untereinander-> nebeneinander anzeigen lassen wie?
    Von musti1989 im Forum HTML & CSS Forum
    Antworten: 10
    Letzter Beitrag: 14.05.2009, 20:08
  4. Divs untereinander statt nebeneinander
    Von MasterOfDsaster im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 10.04.2009, 14:40
  5. Grafiken nebeneinander und untereinander anbringen
    Von grafik_problem im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 04.10.2005, 18:34

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •