"visibility: hidden" ohne Funktion

harff182

Ich habe einige Icons nach folgendem Schema gesetzt:

CSS

/* alle Text-Files mit text.png bestücken */
.bookmark-item[label$=".txt"] > image,
.bookmark-item[label$=".txt"] > .menu-iconic-left {
    visibility: hidden !important;
}

.bookmark-item[label$=".txt"] {
	background-image: url('../icons/text.png') !important; 
    padding-left: 41px !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 2px !important; 
}

Alles anzeigen

Nun seh ich nur die "Weltkugel".

Was muß ich ändern?

Horstmann

Screenshots wären prima.
Und der seltsame Code hat mal funktioniert, wo kommt der denn her?

Es gibt auch viele aktuelle Themen zu Icons, gerade auch für bookmarks, schätze da wäre was dabei.

harff182

Zitat von Horstmann

Screenshots wären prima.

Zitat von Horstmann

Und der seltsame Code hat mal funktioniert, wo kommt der denn her?

CSS

/* 	35_icons_in_Ordnern.css
	Eigene Icons für ausgewählte Bookmarks und im Ordner versteckt dann von andy hier
	https://www.camp-firefox.de/forum/thema/128964/?postID=1135564#post1135564
	
	per "wildcard" siehe unten !!! ;)
	
	Ergänzungen/Erklärungen von Sören hier:https://www.camp-firefox.de/forum/thema/133070
	
	210907: Anpassungen für FF92: ersetze "display: none" durch "visibility: hidden"
*/

/* APOD */
.bookmark-item[label$="APOD-E"] > image,
.bookmark-item[label$="APOD-E"] > .menu-iconic-left {
    visibility: hidden!important;
}

.bookmark-item[label$="APOD-E"] {
    background-image: url('../icons/apod.png') !important; 
    padding-left: 41px !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 2px !important; 	
}

/* alle perrypedia-Files mit perrypedia.png bestücken - klappt auch */
.bookmark-item[label$="Perrypedia"] > image,
.bookmark-item[label$="Perrypedia"] > .menu-iconic-left {
    visibility: hidden! important;
}

.bookmark-item[label$="Perrypedia"] {
	background-image: url('../icons/perrypedia.png') !important; 
    padding-left: 41px !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 2px !important; 
}

/* alle Spoiler-Files mit Perry.png bestücken - klappt auch */
.bookmark-item[label^="Perry Rhodan"] > image,
.bookmark-item[label^="Perry Rhodan"] > .menu-iconic-left {
    visibility: hidden! important;
}

.bookmark-item[label^="Perry Rhodan"] {
	background-image: url('../icons/Perry.png') !important; 
    padding-left: 41px !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 2px !important; 
}

.bookmark-item[label^="Spoiler"] > image,
.bookmark-item[label^="Spoiler"] > .menu-iconic-left {
    visibility: hidden! important;
}

.bookmark-item[label^="Spoiler"] {
	background-image: url('../icons/Perry.png') !important; 
    padding-left: 41px !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 2px !important; 
}

/* Dreslough.com - mein Avatar */
.bookmark-item[label$="mein_Avatar"] > image,
.bookmark-item[label$="mein_Avatar"] > .menu-iconic-left {
    visibility: hidden!important;
}

.bookmark-item[label$="mein_Avatar"] {
    background-image: url('../icons/ERF2-avatar.png') !important; 
    padding-left: 41px !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 2px !important; 
}

/* alle Text-Files mit text.png bestücken */
.bookmark-item[label$=".txt"] > image,
.bookmark-item[label$=".txt"] > .menu-iconic-left {
    visibility: hidden !important;
}

.bookmark-item[label$=".txt"] {
	background-image: url('../icons/text.png') !important; 
    padding-left: 41px !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 2px !important; 
}

/* Bundestagswahlen - Landeshauptstadt Düsseldorf */
.bookmark-item[label="Bundestagswahlen - Landeshauptstadt Düsseldorf"] > image,
.bookmark-item[label="Bundestagswahlen - Landeshauptstadt Düsseldorf"] > .menu-iconic-left {
    visibility: hidden!important;
}

.bookmark-item[label="Bundestagswahlen - Landeshauptstadt Düsseldorf"] {
	background-image: url('../icons/ddorf16.png') !important; 
    padding-left: 41px !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0x 2px !important;
}

/* Terminvereinbarungen - Landeshauptstadt Düsseldorf */
.bookmark-item[label="Terminvereinbarung"] > image,
.bookmark-item[label="Terminvereinbarung"] > .menu-iconic-left {
    visibility: hidden!important;
}

.bookmark-item[label="Terminvereinbarung"] {
	background-image: url('../icons/ddorf16.png') !important; 
    padding-left: 41px !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 2px !important;
}

/* Landeshauptstadt Düsseldorf anfangs*/
/* neeeee.... so geht das nu doch nich: genauer hingucken bzw benennen*/

.bookmark-item[label*="Landeshauptstadt Düsseldorf"] > image,
.bookmark-item[label*="Landeshauptstadt Düsseldorf"] > .menu-iconic-left {
    visibility: hidden!important;
}

.bookmark-item[label*="Landeshauptstadt Düsseldorf"] {
	background-image: url('../icons/ddorf16.png') !important; 
    padding-left: 41px !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 2px !important; 
}

/* AWISTA irgendwo */
.bookmark-item[label*="AWISTA"] > image,
.bookmark-item[label*="AWISTA"] > .menu-iconic-left {
    visibility: hidden!important;
}

.bookmark-item[label*="AWISTA"] {
	background-image: url('../icons/awista.png') !important; 
    padding-left: 41px !important; 
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 2px !important; /*x y*/
}

/* Seniorenwohnen irgendwo */
.bookmark-item[label*="Seniorenwohnen"] > image,
.bookmark-item[label*="Seniorenwohnen"] > .menu-iconic-left {
    visibility: hidden!important;
}

.bookmark-item[label*="Seniorenwohnen"] {
	background-image: url('../icons/pflege.png') !important; 
    padding-left: 41px !important; 
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 2px !important; /*x y*/
}

/*	Mein Nachfrage bezüglich "wildcards":
	https://www.camp-firefox.de/forum/thema/132857
*/

/*	alle PDF-Files mit pdf.png bestücken */
/* 	Wenn der Bookmarknamen auf .pdf endet: Infoblatt zum Winterdienst.pdf */
.bookmark-item[label$=".pdf"] > image,
.bookmark-item[label$=".pdf"] > .menu-iconic-left {
    visibility: hidden!important;
}

.bookmark-item[label$=".pdf"] {
	background-image: url('../icons/pdf.png') !important; 
    padding-left: 41px !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 2px !important; /*x y*/
}


/* alle OO-Files mit Open-Office-32.png bestücken - klappt auch */
.bookmark-item[label$=".ods"] > image,
.bookmark-item[label$=".ods"] > .menu-iconic-left {
    visibility: hidden!important;
}

.bookmark-item[label$=".ods"] {
	background-image: url('../icons/Open-Office-32.png') !important; 
    padding-left: 41px !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 2px !important; /*x y*/
}

/*	alle PNG-Files mit gfx.png bestücken */
/* 	Wenn der Bookmarknamen auf .png endet */
.bookmark-item[label$=".png"] > image,
.bookmark-item[label$=".png"] > .menu-iconic-left {
    visibility: hidden!important;
}

.bookmark-item[label$=".png"] {
	background-image: url('../icons/gfx.png') !important; 
    padding-left: 41px !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 2px !important; /*x y*/
}

/*	alle jpg-Files mit gfx.png bestücken */
/* 	Wenn der Bookmarknamen auf .jpg endet */
.bookmark-item[label$=".jpg"] > image,
.bookmark-item[label$=".jpg"] > .menu-iconic-left {
    visibility: hidden!important;
}

.bookmark-item[label$=".jpg"] {
	background-image: url('../icons/gfx.png') !important; 
    padding-left: 41px !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 2px !important; /*x y*/
}

Alles anzeigen

2002Andreas

Zitat von harff182

Was muß ich ändern?

Teste, und ersetz mal:

visibility:hidden;

zu

display:none !important;

harff182

Zitat von 2002Andreas

Teste, und ersetz mal:

Bleibt wie es ist.

Horstmann

Zitat von harff182

Bleibt wie es ist.

Anstelle von deinem Code aus #1, probier mal:

CSS

.bookmark-item[label$=".txt"] img {
    content: url('../icons/text.png') !important;
}

Das wäre dann nur für die Icons aus deinem Screenshot, etwas allgemein gefasst.
Ansonsten hattest du die fast gleiche Frage schon mal gestellt, wenn ich mich nicht täusche.

harff182

Zitat von Horstmann

Das wäre dann nur für die Icons im Popup aus deinem Screenshot.

Das Popup ist aus der Lesezeichenleiste, nicht dem Menü...

Zitat

Ansonsten hattest du die fast gleiche Frage schon mal gestellt, wenn ich mich nicht täusche

Ähnlich, aber ein anderer Fall.

Ich werd mir aber meine Lösung von da mal ansehen und das CSS versuchen aufzuräumen und überarbeiten.

guuts nächtle..

Horstmann

Zitat von harff182

Zitat von Horstmann

Das wäre dann nur für die Icons im Popup aus deinem Screenshot.

Das Popup ist aus der Lesezeichenleiste, nicht dem Menü...

Nicht ganz klar, aber ich hab einen Fehler gemacht, oben jetzt evtl. korrigiert.

2002Andreas

Zitat von harff182

Das Popup ist aus der Lesezeichenleiste

Teste bitte erneut wenn du magst.

Ich habe nur mal mein Icon und den Abstand angepasst:

CSS

/* alle Text-Files mit text.png bestücken */
#PlacesToolbarItems > toolbarbutton > menupopup > menuitem[label$=".txt"] img,
.bookmark-item[label$=".txt"] > image,
.bookmark-item[label$=".txt"] > .menu-iconic-left {
    visibility: hidden !important;
}

.bookmark-item[label$=".txt"] {
	background-image: url('file:///C:/Users/weiss/IconsFirefox/Computer_File_064.gif') !important; 
    padding-left: 4px !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important; 
    background-position: 0px 12px !important; 
}

Alles anzeigen

Zeile 2 ist zusätzlich.

.DeJaVu

Es wäre toll, wenn ihr euren CSS Murks mal öfters prüfen würdet.

Code

.menu-iconic-left

Gibt es gar nicht mehr, schon seit vor v140 nicht mehr. Also über 3 Monate veraltet. Hätte also wesentlich früher auffallen müssen.

Search - mozsearch

Code

.bookmark-item[label$=".txt"] > img

Ist aber nichts Neues im Forum, das hat Andreas jetzt so oft korrigiert.

Horstmann

Zitat von .DeJaVu
Code
.bookmark-item[label$=".txt"] > img
Ist aber nichts Neues im Forum, das hat Andreas jetzt so oft korrigiert.

Yupp, das kommt ursprünglich aber aus der oben verlinkten Thread, 2te Seite, wenn du die mal durchlesen willst.

.DeJaVu

Nö, mag ich nicht, ist mir alles zu unordentlich

Mitleser

harff182 , dieses funzt mit relativem Pfad (Anstatt des kompletten Codes aus Beitrag #1):

CSS

/*Lesezeichen mit einem definierten Text in der Lesezeichenleiste sowie im Dropdown der Lesezeichenleiste (Änderung in 143)*/
.bookmark-item[label$=".txt"] :is(img, image) {
	content: url('../icons/text.png') !important;
}

"visibility: hidden" ohne Funktion

Beitrag von Mitleser (1. Oktober 2025 um 21:41)

Ähnliche Themen

Meine "Vertical Add-on Bar" funktioniert mit Fx143 nicht mehr?!

about-newtab Seite individuelle Icons via usercontent.css funktioniert nicht mehr seit ff-141

Skript VerticalToolbar.uc.js funktioniert in neu erstellten Profilen nicht mehr richtig

Skript für vertikale Toolbar funktioniert im heutigen Nightly nicht mehr richtig

addonbar.us.js funktioniert nicht mehr

CSS-Code für mehrreihige Tableiste funktioniert nicht mehr