css fehler menü gestaltung seitenlink im post

svenjatzu

Hi
ich habe irgendwie in der css meiner navigation einen fehler im hoover gemacht kann mal bitte einer drüber schauen und mir sagen wie ich das korrigieren kann?

danke

hier der link

http://www.fairsicherungsordner.de/

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

helix

Wenn du jetzt noch sagst, woraus der Fehler deiner Meinung nach besteht?

Meinst du das Verschieben zur Seite? Das liegt am größer Werden der Schrift. => Gib den Containern (wahrscheinlich li-Tags) eine Mindestbreite.
Oder meinst du das, was sich unten rausschiebt, dass dann entweder unterm gesamten Text blau sein sollte oder der Text erst hinterm Blau anfangen? => für Letzteres mehr padding-left.
Oder meinst du, dass das gehoverte Menü sich Registrieren / Login / Unsere Berater in die Quere kommt?
Ach ja, und der Unterpunkt ganz rechts wird bei kleineren Bildschirmen abgeschnitten. Da wäre es vielleicht sinnvoller, die Unterpunkte mit Textausrichtung rechts anzulegen und nach links in die Seite „wachsen“ zu lassen.

Gruß
helix

svenjatzu

ja es geht um die farbe im sub menu, dort wird ja nur 1 cm ca in blau angezeigt, der rest ist transparent. padding left - wo im css finde ich diese - dort gibt es eine menge paddings lefts

svenjatzu

CSS

<!-- Start PureCSSMenu.com STYLE -->
<style>
#pcm{display:none;}
ul.pureCssMenu ul{display:none}
ul.pureCssMenu li:hover>ul{display:block}
ul.pureCssMenu ul{position: absolute;left:-1px;top:98%;}
ul.pureCssMenu ul ul{position: absolute;left:98%;top:-2px;}
ul.pureCssMenu,ul.pureCssMenu ul {
    margin:0px;
    list-style:none;
    padding:0px 2px 2px 0px;
    background-color:transparent;
    background-repeat:repeat;
    border-color:#aaaaaa;
    border-width:0px;
    border-style:solid;
}
ul.pureCssMenu table {border-collapse:collapse}ul.pureCssMenu {
    display:block;
    zoom:1;
    float: left;
}
ul.pureCssMenu ul{
    width:610.0500000000001px;
}
ul.pureCssMenu li{
    display:block;
    margin:2px 0px 0px 2px;
    font-size:0px;
}
ul.pureCssMenu a:active, ul.pureCssMenu a:focus {
outline-style:none;
}
ul.pureCssMenu a, ul.pureCssMenu li.dis a:hover, ul.pureCssMenu li.sep a:hover {
    display:block;
    vertical-align:middle;
    background-color:#transparent;
    border-width:0px;
    border-color:#1032B3;
    border-style:solid;
    text-align:left;
    text-decoration:none;
    padding:4px;
    _padding-left:0;
    font:bold 17px Verdana;
    color: #1032B3;
    text-decoration:none;
    cursor:default;
}
ul.pureCssMenu span{
    overflow:hidden;
}
ul.pureCssMenu li {
    float:left;
}
ul.pureCssMenu ul li {
    float:none;
}
ul.pureCssMenu ul a {
    text-align:left;
    white-space:nowrap;
}
ul.pureCssMenu li.sep{
    text-align:center;
    padding:0px;
    line-height:0;
    height:100%;
}
ul.pureCssMenu li.sep span{
    float:none;    
padding-right:0;
    width:5;
    height:16;
    display:inline-block;
    background-color:#AAAAAA;    background-image:none;}
ul.pureCssMenu ul li.sep span{
    width:80%;
    height:3;
}
ul.pureCssMenu li:hover{
    position:relative;
}
ul.pureCssMenu li:hover>a{
    background-color:#E22110;
    border-color:#1032B3;
    border-style:solid;
    font:bold 19px Verdana;
    color: #1032B3;
    text-decoration:none;
}
ul.pureCssMenu li a:hover{
    position:relative;
    background-color:#E22110;
    border-color:#665500;
    border-style:solid;
    font:bold 19px Verdana;
    color: #1032B3;
    text-decoration:none;
}
ul.pureCssMenu li.dis a {
    color: #AAAAAA !important;
}
ul.pureCssMenu img {border: none;float:left;_float:none;margin-right:4px;width:26px;
height:26px;
}
ul.pureCssMenu ul img {width:26px;
height:26px;
}
ul.pureCssMenu img.over{display:none}
ul.pureCssMenu li.dis a:hover img.over{display:none !important}
ul.pureCssMenu li.dis a:hover img.def {display:inline !important}
ul.pureCssMenu li:hover > a img.def  {display:none}
ul.pureCssMenu li:hover > a img.over {display:inline}
ul.pureCssMenu a:hover img.over,ul.pureCssMenu a:hover ul img.def,ul.pureCssMenu a:hover a:hover 


img.over{display:inline}
ul.pureCssMenu a:hover img.def,ul.pureCssMenu a:hover ul img.over,ul.pureCssMenu a:hover a:hover 


img.def{display:none}
ul.pureCssMenu a:hover ul{display:block}
ul.pureCssMenu span{
    display:block;
    background-image:url(./images/arrv_anim_1.gif);
    background-position:right center;
    background-repeat: no-repeat;
   padding-right:11px;}
ul.pureCssMenu li:hover>a>span{    background-image:url(./images/arrv_anim_1o.gif);
}
ul.pureCssMenu a:hover span{    _background-image:url(./images/arrv_anim_1o.gif)}
ul.pureCssMenu ul span,ul.pureCssMenu a:hover table span{background-image:url


(./images/arr_double_1.gif)}
ul.pureCssMenu ul li:hover > a span{    background-image:url(./images/arr_double_1o.gif);}
ul.pureCssMenu table a:hover span{background-image:url(./images/arr_double_1o.gif)}
</style>
<!-- End PureCSSMenu.com STYLE -->

Alles anzeigen

maxe

kein Wunder, wenn die width für .main-navigation ul ul a nur 22px beträgt :shock:

svenjatzu

danke!

jetzt würde ich gerne noch das submenu genau unter dem parent platzieren und den rand auf beiden seiten beim sub gleich gross anpassen, wo mach ich das?

oh schitt, grade hab ich festgestellt, wenn ich die seite etwas runterscrolle dann kann ich die subs garnicht mehr auswählen :cry:

svenjatzu

und a last thing, ich würde gerne die schriftfarbe vom submenü ändern, die die angezeigt wird wenn sich das drop öffnet @ graue schrift - wo finde ich diese?

Willkommen! Melden Sie sich an oder registrieren Sie sich.

css fehler menü gestaltung seitenlink im post

Jetzt mitmachen!