✓[Stylish/userChrome.css] Abstände der Buttons verkleinern

    Hi Leute,

    mich nervt seit Fx 29 der riesige Abstand der einzelnen Buttons in der nav-bar zueinander. Ich habe mir jetzt aus diesem Style den folgenden Schnipsel zurechtgezimmert:

    CSS
    #nav-bar toolbarbutton {
    margin: 0 -5px 0 -5px !important; 
    padding: 0 -5px 0 -5px !important;
}


    Sieht so aus: [attachment=0]1.png[/attachment]

    Für die nav-bar ist das ok so. Allerdings macht er das damit auch für die Buttons, die ich mittels des userchome.js-Scriptes AddToolbarInsideLocationBar.uc.js in der Urlbar anzeigen lasse. Ich nehme an, weil die Buttons dabei ja links der Urlbar in der navbar und dort in der UCJS-Toolbar "gesammelt" werden, bevor sie letztendlich in der Urlbar angezeigt werden. Und da die Abstände dieser Buttons (warum auch immer) viel kleiner sind, sehen sie dann so wie oben links im Bild aus.

    Wie kann ich diese UCJS-Toolbar nun im obigen Schnipsel als Ausnahme setzen?
    Oder vielleicht weiß jemand generell nen besseren Code (ohne das jetzt für jeden Button einzeln zu machen).

    Gruß,
    Mic

    Hallo.

    Eine Ausnahme funktioniert vielleicht in etwa so:

    CSS
    #ucjs-Locationbar-toolbar toolbarbutton {
    margin: 0 0 0 0 !important;
    padding: 0 0 0 0 !important;
}


    Den Code jedenfalls nach deinem Code einfügen.

    Aha, bei mir hat das aber definitiv eine Auswirkung, wenn ich die Werte nur bei padding von z.B. -8 auf 0 setze. Bei -8 ist der Abstand aber größer, so wie es aussieht. Merkwürdig, aber diesen Padding/margin-Krams hab noch nie wirklich verstanden.

    EDIT: OK, sollte wohl doch ein Hinweis sein, dass Minuswerte nicht gehen. Vielleicht ignoriert er immer das Minus und rechnet da einfach alles als +?
    EDIT²: Ne, passt auch irgendwie nicht. Bin wieder mal soweit, dass ich nicht checke, was er da überhaupt macht. Ich lass es vorerst mit meinen Minuswerten, das passt am besten so.

    Hallo Miccovin..

    Zitat von Miccovin

    von z.B. -8 auf 0 setze


    Logisch, weil er den Wert 0 ja auch annimmt. Wahrscheinlich war der Abstand also vorher bei mehr als 0, deswegen auch die Wirkung wenn du jetzt 0 einträgst.

    Hier mal ein Beispiel nur mit padding Werten im Minus, das auch noch übertrieben mit -85 und bezogen auf alle Buttons:

    [Blockierte Grafik: http://www11.pic-upload.de/thumb/28.06.14/i6bwlj7p1j4u.jpg]

    Du erkennst im Stylishfenster schon den Warnhinweis, und kein Button hat sich verschoben.

    Ich meinte das anders.

    Du hast -8 eingetragen.....dieser Wert wird aber nicht verarbeitet. :!:
    Dann hast du ihn auf 0 gesetzt...das wurde erkannt.

    Also war wahrscheinlich der erkannte Wert vorher! auf z.B. 3...und durch das ändern auf 0 hat sich dann der Button verschoben.
    3 war jetzt nur ein Beispiel, gemeint ist der von Firefox vorgegebene Standardwert vom Abstand der Buttons.

    Minuswerte bei padding werden nicht erkannt bzw. angenommen, nur bei margin.

    Ok, ich habe jetzt die negativen padding-Werte auf 0 gesetzt, und dann margin so verändert, dass es wieder passt. Bin so zufrieden damit.

    CSS
    #nav-bar toolbarbutton {
    margin: 0 -4px 0 -4px !important; 
    padding: 0 0px 0 0px !important;
}


/* Ausnahme ucjs-Locationbar-toolbar */
#ucjs-Locationbar-toolbar toolbarbutton {
    margin: 0 -1px 0 -1px !important;
}

    [attachment=0]1.png[/attachment]

    padding ist innerhalb, margin ausserhalb des Rands. Beides unsichtbar, nur border dazwischen ist sichtbar, wenn nicht explizit transparent gesetzt.

    Die Werte für oben, rechts, unten, links lassen sich auch kombinieren:
    http://www.w3schools.com/css/css_margin.asp

    HTH