Kontextmenü mit Rahmen versehen

    • Neu
    Firefox-Version
    129.0.2
    Betriebssystem
    Win 11 Pro 24H2 26120.1457

    Hallo zusammen,

    Ich hab mir bei meinem Firefox mit folgendem CSS Code einen Rahmen um das rechtsmausige Kontextmenü erstellt.

    CSS
    /* Rahmen für Kontextmenü */
menupopup {
    border: 2px solid #00bbff; 
    padding: 0; /* Entfernt inneren Abstand */
    margin: 0; /* Entfernt äußeren Abstand */
}

    Das funktioniert soweit, jedoch habe ich zwischen dem Kontextmenü und dem Rahmen immer einen Spalt den ich auch mit verschiedenen

    padding: oder margin: Werten nicht wegbekomme.

    Auch ein anderer Ansatz in der userChrome.css brachte mehr oder weniger dasselbe Ergebnis.

    CSS
    /* Rahmen für das Kontextmenü */
#contentAreaContextMenu {
    border: 2px solid red; 
    padding: 0; /* Entfernt inneren Abstand */
    margin: 0; /* Entfernt äußeren Abstand */
}

    Wie kann ich den Rahmen direkt um das Kontextmenü legen?
    Für zielführende Antworten schon mal danke im voraus.

    • Neu
    Zitat von Nikolaus2001at

    Wie kann ich den Rahmen direkt um das Kontextmenü legen?

    Teste bitte das ↓ CSS-Schnipsel.

    CSS
    .menupopup-arrowscrollbox {
    appearance: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

    appearance: none !important; kannst Du eventuell weglassen.

    Es grüßt,

    Ralf

    • Neu

    Oder:

    CSS
    #contentAreaContextMenu  {
    border-image:  linear-gradient(#00bbff, #00bbff) 1 / 5px !important;
}

    Oder so:

    CSS
    #contentAreaContextMenu  {
  --panel-border-color: #00bbff !important;
    border-image:  linear-gradient(#00bbff, #00bbff) 1 / 5px !important;
}

    Mit freundlichem Gruß
    Andreas
    Mein Laptop Neu Meine Add-ons

    2 Mal editiert, zuletzt von 2002Andreas (26. August 2024 um 22:24) aus folgendem Grund: Ein Beitrag von 2002Andreas mit diesem Beitrag zusammengefügt.

    • Neu

    Ich denke, es könnte dies fehlen:

    --panel-shadow-margin: 0px !important;

    Im neuen Profil getestet und es funktioniert auch:

    CSS
    menupopup {
    border: 2px solid #00bbff; 
    padding: 0; /* Entfernt inneren Abstand */
    margin: 0; /* Entfernt äußeren Abstand */
	--panel-shadow-margin: 0 !important; /* Entfernt den für den Schatten vorgesehenden Abstand */
}

    Dieser Beitrag wurde ohne Hilfe einer 'KI' erstellt.

    2 Mal editiert, zuletzt von Mitleser (27. August 2024 um 00:52)

    • Neu

    Auch von mir einen kleinen Beitrag.

    CSS
    menupopup {
  border: 2px solid #00bbff;
  border-radius: 4px !important;				/* Radius für den Rahmen */
  --panel-border-color: transparent !important;	/* Setz mal eine Farbe ein! */
  --panel-shadow-margin: 0 !important; 			/* Entfernt den für den Schatten vorgesehenden Abstand */
}

    Das schöne ist, das Aussehen des Popups lässt sich noch viel weiter anpassen!

    Z.B. : --panel-color: die Schriftfarbe, --panel-background: die Hintergrundfarbe, oder auch --panel-border-radius: der Radius des Popups an sich, kann zur Anpassung wichtig sein, wenn der Radius des Rahmens geändert wird und die Hintergrundfarbe geändert wird. Viel Spaß beim Herumexperimentieren.

    Mit <3lichem Gruß

    Mira

    • Neu

    Kurze Rückmeldung,

    nachdem ich mir die Rosinen herausgepickt habe erscheint der Rahmen jetzt so wie ich mir das vorstelle.
    Ich danke allen die sich an dem Thread beteiligt haben für ihre Hilfe.

    MfG, Manfred