Habe in meiner Lesezeichen-Symbolleiste per CSS diverse Anpassungen des Textes zu einem Link-Icon vorgenommen. Ist es möglich, sowohl das Icon als auch den Text mit einem gemeinsamen Rand zu umgeben ? (konstruierte Beispiele siehe Anhang). Bei Ordnern ist das kein Problem, habe ich schon erledigt, aber bei links fehlt mir der Code.
Lesezeichen-Symbolleiste: Icon+Text umranden.
-
Pentomino -
15. Dezember 2017 um 12:29 -
Erledigt
-
Teste bitte mal:
CSStoolbarbutton[class="bookmark-item"][label="Drive"]{ border:2px solid red!important; }Den Namen musst du unter:[label="....."] jeweils anpassen.
-
kanste dir das mal anschauen ob das für hier passt
aus meiner userChrome.css
CSS
Alles anzeigen/* Do not remove the @namespace line -- it's required for correct functioning * set default namespace to XUL */ @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /***** Abschnitt "Nur in der Browser-Oberfläche" *****/ @-moz-document url-prefix(chrome://browser/content/browser.xul) { /* Rahmen-Stärke, -Farbe, -Radius und Abstände der Buttons */ /* in der Menue-Leiste */ #toolbar-menubar toolbarbutton { border: 1px solid #999 !important; margin: 2px !important; border-radius: 4px !important; } /* in der TAB-Leiste */ #TabsToolbar toolbarbutton { border: 1px solid #ccc !important; margin: 2px !important; border-radius: 4px !important; } /* in der Haupt-Leiste */ #nav-bar toolbarbutton { border: 1px solid #ccc !important; margin: 2px !important; border-radius: 4px !important; } /* in der Lesezeichen-Leiste */ #PersonalToolbar toolbarbutton { border: 1px solid #ccc !important; margin: 2px !important; border-radius: 4px !important; } /* Lesezeichen Text Schriftfarbe je nach Label-Name verschieden */ #PersonalToolbar .bookmark-item[label="Name1"] > .toolbarbutton-text, #PersonalToolbar .bookmark-item[label="Name2"] > .toolbarbutton-text { color:#f77 !important } #PersonalToolbar .bookmark-item[label="Name3"] > .toolbarbutton-text, #PersonalToolbar .bookmark-item[label="Name4"] > .toolbarbutton-text { color:#7ff !important } /* Alle anderen Lesezeichen */ #PersonalToolbar .bookmark-item { color:#fff; text-shadow:none !important; } } /***** Ende "Nur in der Browser-Oberfläche" *****/danke
uni
-
Hallo universum123..
Fehler sind keine vorhanden in dem Code, ergo müsste auch alles funktionieren.
Haben die Lesezeichen wirklich diesen Namen?Name1...Name2....
Hatte ich falsch verstanden, sorry :oops: -
:-??
hmmmm....
ich habe das nur so übernommen
wer das mal gepostet hat weiß ich nicht mehr
mir haben nur "damals" die Rahmen gefallen
was das andere zu besagen hat :-??
wie gesagt - es ging mir nur die Rahmen
was kann ich davon im "code" entsorgen das nur das für die Rahmen über bleibt
danke uni
-
Wenn du nur den Rahmen möchtest teste bitte mal diesen Code:
CSS
Alles anzeigen/* Do not remove the @namespace line -- it's required for correct functioning * set default namespace to XUL */ @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /***** Abschnitt "Nur in der Browser-Oberfläche" *****/ @-moz-document url-prefix(chrome://browser/content/browser.xul) { /* Rahmen-Stärke, -Farbe, -Radius und Abstände der Buttons */ /* in der Menue-Leiste */ #toolbar-menubar toolbarbutton { border: 1px solid #999 !important; margin: 2px !important; border-radius: 4px !important; } /* in der TAB-Leiste */ #TabsToolbar toolbarbutton { border: 1px solid #ccc !important; margin: 2px !important; border-radius: 4px !important; } /* in der Haupt-Leiste */ #nav-bar toolbarbutton { border: 1px solid #ccc !important; margin: 2px !important; border-radius: 4px !important; } /* in der Lesezeichen-Leiste */ #PersonalToolbar toolbarbutton { border: 1px solid #ccc !important; margin: 2px !important; border-radius: 4px !important; } } /***** Ende "Nur in der Browser-Oberfläche" *****/ -
:klasse:
hat gefunzt
thx
-
Freut mich, war gern geschehen
-
andreas
habe mich mal bedient. Rahmen sind vorhanden.
Könnte die Umrandung noch ein wenig verstärkt werden? -
Aber ja doch :wink:
Überall bei diesen Bezeichnungen:
border: 1px solid #999 !important;
einfach eine höhere Zahl einsetzen.
-
Grandios was ich hier alles finde :klasse:
Ich hab die Rahmen
schwarz eingefärbt und auf 1 stehen lassen, sieht noch besser aus.
Danke Andreas. -
Habe mal die 2px probiert!
Was soll ich sagen >> :klasse:
Vielen Dank! -
>> etwas zu früh gefreut?
In allen portablen Vversionen (4) wird die Lesezeichen-Symbolleiste von der Tab-Leiste etwas zugedeckt. -
von der Tab-Leiste etwas zugedeckt.
Dann teste bitte wieder:CSS
Alles anzeigen/* Do not remove the @namespace line -- it's required for correct functioning * set default namespace to XUL */ @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /***** Abschnitt "Nur in der Browser-Oberfläche" *****/ @-moz-document url-prefix(chrome://browser/content/browser.xul) { /* Rahmen-Stärke, -Farbe, -Radius und Abstände der Buttons */ /* in der Menue-Leiste */ #toolbar-menubar toolbarbutton { border:2px solid #999 !important; border-radius: 4px !important; } /* in der TAB-Leiste */ #TabsToolbar toolbarbutton { border: 2px solid #ccc !important; border-radius: 4px !important; } /* in der Haupt-Leiste */ #nav-bar toolbarbutton { border: 2px solid #ccc !important; border-radius: 4px !important; } /* in der Lesezeichen-Leiste */ #PersonalToolbar toolbarbutton { border: 2px solid #ccc !important; border-radius: 4px !important; } } /***** Ende "Nur in der Browser-Oberfläche" *****/
Danke Andreas.
Gerne doch -
Nun habe ich Beispiele z.Hd.
1.) Notebook Win 10 64bit - FX 57.0.2 (mit vorheriger *.css)[Blockierte Grafik: https://www2.pic-upload.de/img/34477472/Rahmen_Fx.jpg]
2.) FX portable 57.0.2 (mit Nachfolger *.css)
[Blockierte Grafik: https://www2.pic-upload.de/img/34477476/Rahmen_Fx_mob.jpg]
So ganz passt es noch nicht, oder?
-
So ganz passt es noch nicht, oder?
Nee :wink:
Teste wieder:CSS
Alles anzeigen/* Do not remove the @namespace line -- it's required for correct functioning * set default namespace to XUL */ @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /***** Abschnitt "Nur in der Browser-Oberfläche" *****/ @-moz-document url-prefix(chrome://browser/content/browser.xul) { /* Rahmen-Stärke, -Farbe, -Radius und Abstände der Buttons */ /* in der Menue-Leiste */ #toolbar-menubar toolbarbutton { border: 1px solid #999 !important; margin-top: 2px !important; border-radius: 4px !important; } /* in der TAB-Leiste */ #TabsToolbar toolbarbutton { border: 1px solid #ccc !important; margin-top: 2px !important; border-radius: 4px !important; } /* in der Haupt-Leiste */ #nav-bar toolbarbutton { border: 1px solid #ccc !important; margin-top: 2px !important; border-radius: 4px !important; } /* in der Lesezeichen-Leiste */ #PersonalToolbar toolbarbutton { border: 1px solid #ccc !important; margin-top: 2px !important; border-radius: 4px !important; } } /***** Ende "Nur in der Browser-Oberfläche" *****/ -
-
Ok, noch ein Test :wink:
CSS
Alles anzeigen/* Do not remove the @namespace line -- it's required for correct functioning * set default namespace to XUL */ @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /***** Abschnitt "Nur in der Browser-Oberfläche" *****/ @-moz-document url-prefix(chrome://browser/content/browser.xul) { /* Rahmen-Stärke, -Farbe, -Radius und Abstände der Buttons */ /* in der Menue-Leiste */ #toolbar-menubar toolbarbutton { border: 2px solid #999 !important; margin-top: -2px !important; margin-bottom: 2px !important; border-radius: 4px !important; } /* in der TAB-Leiste */ #TabsToolbar toolbarbutton { border: 2px solid #ccc !important; margin-bottom: 0px !important; margin-top: -2px !important; border-radius: 4px !important; } /* in der Haupt-Leiste */ #nav-bar toolbarbutton { border: 2px solid #ccc !important; margin-bottom: 3px !important; margin-top: 2px !important; border-radius: 4px !important; } /* in der Lesezeichen-Leiste */ #PersonalToolbar toolbarbutton { border: 2px solid #ccc !important; margin-bottom: 3px !important; margin-top: 2px !important; border-radius: 4px !important; } } /***** Ende "Nur in der Browser-Oberfläche" *****/Edit:
Rahmenstärke auf 2px erhöht. -
Oder so mit 4 Abständen:
CSS
Alles anzeigen/* Do not remove the @namespace line -- it's required for correct functioning * set default namespace to XUL */ @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /***** Abschnitt "Nur in der Browser-Oberfläche" *****/ @-moz-document url-prefix(chrome://browser/content/browser.xul) { /* Rahmen-Stärke, -Farbe, -Radius und Abstände der Buttons */ /* in der Menue-Leiste */ #toolbar-menubar toolbarbutton { border: 2px solid #999 !important; margin: 2px 2px 2px 2px!important; border-radius: 4px !important; } /* in der TAB-Leiste */ #TabsToolbar toolbarbutton { border: 2px solid #ccc !important; margin: 2px 2px 2px 2px!important; border-radius: 4px !important; } /* in der Haupt-Leiste */ #nav-bar toolbarbutton { border: 2px solid #ccc !important; margin: 2px 2px 2px 2px!important; border-radius: 4px !important; } /* in der Lesezeichen-Leiste */ #PersonalToolbar toolbarbutton { border: 2px solid #ccc !important; margin: 2px 2px 2px 2px!important; border-radius: 4px !important; } } /***** Ende "Nur in der Browser-Oberfläche" *****/Und wenn dann jeweils hier:
margin: 2px 2px 2px 2px!important;die Abstände ändern.
Die Werte sind für: Oben...Links...Rechts...Unten -
zu #18
[Blockierte Grafik: https://www2.pic-upload.de/img/34477698/Rahmen_Fx_mob2.jpg]
Beitrag 19 werde ich später testen - mir raucht schon wieder der Kopf.
Den brauche ich noch für die (heutige) Fußballübertragung!
Vorerst weiteren Dank!
PS: mein Hauptprogramm FX 57.0.2 ist ja ok (die mobilen auf dem PC sind alle lauffähig, die Fx 58.b010 ist z.Zt. sowieso zickig! )
Deswegen ist keine Eile geboten.Werde auch das funktionierende Beispiel mal auf dem PC ausprobieren - dann sehen wir weiter!
Schönen Abend noch!