Abgerundete Tabs auch beim Hover

  • Firefox-Version
    87.0a1 / 85.0
    Betriebssystem
    openSUSE Leap 15.2

    Noch eine Frage von mir, weil es mir gerade keine Ruhe lässt.

    Meine Tabs sind ja schön abgerundet. Den CSS-Code fand ich hier im Forum und es gefällt mir super.

    Ein inaktiver Tab ist transparent - auch völlig in Ordnung.

    Wenn man aber mit der Maus drüber fährt, dann ist er eckig.

    Ich hab mir mit dem Inspector schon die Augen verdreht, bin aber nicht zur richtigen Stelle gelangt.

    Könntet ihr mich so virtuell dahin "schubsen"?

    Ein Bild fürs Verständnis:

    Mein CSS zu den Tabs (.tabbrowser-tab:hover ist mein vergeblicher Versuch zum Anliegen):

    Viele Grüße,
    reni
    ----------------------------
    OS: Leap15.5 / FF immer aktuell ;)

  • nach Zeile 10 das einfügen

    CSS
    .tab-background:not([selected=true]) {
    background: lightgrey !important;
    border-radius: 80px !important;
    border:none!important;
    }

    das lightgrey kannst du nach Bedarf ändern

    Hilfe auch im deutschsprachigen Matrix-Chat möglich oder im IRC-Chat
    Meine Anleitungstexte dürfen gerne "geklaut" und weiter verwendet/kopiert werden ;)

  • glaube habe dich falsch verstanden, dann vergiss meinen oberen Code. Vielleicht solltest du in Zeile 20-23 deinen Code durch diesen hier ersetzen

    CSS
    .tabbrowser-tab:hover {
    background: lightgrey !important;
    border-radius: 80px !important;
    border:none!important;
    }

    Hilfe auch im deutschsprachigen Matrix-Chat möglich oder im IRC-Chat
    Meine Anleitungstexte dürfen gerne "geklaut" und weiter verwendet/kopiert werden ;)

  • Danke für den Schubs. Ich hab es jetzt für mich so gelöst.

    CSS
    .tab-background:not([selected=true]) {
        background: transparent !important;
        border-radius: 80px !important;
        border: 1px solid darkgreen !important;
        }
    .tab-line:not([selected=true]) {
        display:none!important
        }

    Viele Grüße,
    reni
    ----------------------------
    OS: Leap15.5 / FF immer aktuell ;)

  • Ich gebe zu bedenken, dass sämtliche Tab-Anpassungen, die jetzt stattfinden und das standardmäßig aktivierte Design zur Grundlage haben, nur noch eine Lebensdauer von drei Monaten für die finale Version haben und eine noch deutlich geringere für Nightly-Versionen. Ich würde da also nicht zu viel Zeit investieren.

    Darf ich fragen Warum? Ich hab wohl etwas verpasst ...

    Viele Grüße,
    reni
    ----------------------------
    OS: Leap15.5 / FF immer aktuell ;)

  • Mit Firefox 89 im Mai kommt ein neues Design und das schließt auch die Tabs mit ein.

    Ok, danke für die Info.

    Aber weißt du, was ich jetzt hier dabei lerne, bleibt mir doch. Auch wenn ich den CSS-Code dann nicht mehr nutzen kann :)

    Viele Grüße,
    reni
    ----------------------------
    OS: Leap15.5 / FF immer aktuell ;)