About Seiten mit CSS Codes anpassen

  • Damit werden sie zweispaltig.

    CSS
    #serviceworkers{
    column-count: 2 !important;
    }

    Sieht aber nicht gerade toll aus damit.
    Da muss man dann einiges noch anpassen.

    Mfg.

    Endor

    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/109.0.1
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/110.0
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/111.0

    OS: Windows 7 64 bit - Irgendwann Windows 10 64 bit wenn Firma will.
    Kein Support per PN. Fragen bitte im Forum stellen!

    Einmal editiert, zuletzt von Endor ()

  • Hi Endor,

    Damit werden sie zweispaltig.

    die Ansicht ist in der Tat etwas zerrissen.


    Die Darstellung eines Serviceworkers wird leider in beiden Spalten dargestellt, ein Teil ist links unten, der andere Teil des selben Serviceworkers rechts oben. Kann man das verhindern?

    Es grüßt,

    Ralf

  • Hallo Dharkness .

    Leider habe ich bis jetzt keinen Weg gefunden dieses Problem zu beheben.
    Habe einiges versucht, aber nichts funktioniert.

    Zweispaltige Darstellung passt soweit, sieht auch ganz gut aus,

    aber eben diese Aufteilung eines Serviceworkers ein Teil ist links unten, der andere Teil
    des selben Serviceworkers rechts oben, lässt sich bis jetzt nicht beheben.
    Keine Ahnung warum das nicht geht.:/


    Hier der aktuelle CSS Code mit zweispaltiger Darstellung und obigen Darstellungsfehler:


    Mfg.
    Endor

    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/109.0.1
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/110.0
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/111.0

    OS: Windows 7 64 bit - Irgendwann Windows 10 64 bit wenn Firma will.
    Kein Support per PN. Fragen bitte im Forum stellen!

  • Hallo Endor,


    ich habe zumindest einen Weg gefunden, der ab einer bestimmten größe des Viewports ein, so wie es aussieht, sauberes Ergebnis erzeugt, schau Dir mal das ↓ CSS-Schnipsel an.


    Einige der URLs in Skript-Spezifikation: und Aktuelle Worker-Adresse: sind hier rechts lang, deshalb die große Breite von

    @media only screen and und body.

    Es grüßt,

    Ralf

  • Hallo Dharkness


    Habe mir deinen CSS Code mal angeschaut.
    Wie Du schon schreibst hängt er von der Größe des Viewports ab.
    Bei meinem Monitor kann ich den gar nicht so groß machen, dass es funktioniert.
    Trotzdem danke.

    Mfg.
    Endor

    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/109.0.1
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/110.0
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/111.0

    OS: Windows 7 64 bit - Irgendwann Windows 10 64 bit wenn Firma will.
    Kein Support per PN. Fragen bitte im Forum stellen!

  • Hallo Endor,


    Du musst die Werte für die width-Einträge und dem column-gap natürlich Deinem Viewport anpassen, vielleicht kannst Du ja was daraus bauen.

    Es grüßt,

    Ralf

  • Hallo zusammen.

    Hier eine Aktualisierung vom CSS Code für about:support für Firefox 79+


    Neue Schaltfläche Start-Cache löschen und kleinere Anpassungen.


    CSS Code:


    Symbol für neue Schaltfläche:


    Boersenfeger HInweis: obiger Code ist der ohne Abrundungen.
    Wenn Du Deinen mit Abrundungen für Firefox 79 aktualisieren möchtest
    melde dich bitte per PN. Danke. :wink:


    Mfg.
    Endor

    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/109.0.1
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/110.0
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/111.0

    OS: Windows 7 64 bit - Irgendwann Windows 10 64 bit wenn Firma will.
    Kein Support per PN. Fragen bitte im Forum stellen!

    2 Mal editiert, zuletzt von Endor ()

  • hier mal ein Schnellschuß für die Höhe.

    Prima, Dharkness, das funktioniert schon mal. Aber wir müssen wohl abwarten was Endor mit dem Code macht, denn da hat sich ja Einiges geändert, wie es aussieht.

    Grüße vom FuchsFan

  • der Code von Endor enthält ja noch Bestandteile, die hier nicht mehr benötigt werden

    Ah, das meinst Du, Da müsstest Du doch nur die Einträge mit ↓ entfernen oder sie dahingehend ↓↓ ändern und noch ein paar Anpassungen vornehmen.

    CSS
    div.welcomeCard:nth-child(1) > div:nth-child(2) > span:nth-child(2) > button:nth-child(1)
    div.welcomeCard:nth-child(2) > div:nth-child(2) > span:nth-child(2) > button:nth-child(1)
    div.welcomeCard:nth-child(3) > div:nth-child(2) > span:nth-child(2) > button:nth-child(1)
    CSS
    div.indicator:nth-child(1)
    div.indicator:nth-child(2)
    div.indicator:nth-child(3)

    Ich baue mir gerade für die 3 Balken ↑ (Beispiel ↓ für den Ersten Balken) unten noch ein paar Anpassungen, nur das mit Schritt 1 usw. einfügen funktioniert noch nicht.

    Es grüßt,

    Ralf

  • So hier mal etwas für about:welcome


    CSS Code:


    Symbole:    


    Mfg.

    Endor

    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/109.0.1
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/110.0
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/111.0

    OS: Windows 7 64 bit - Irgendwann Windows 10 64 bit wenn Firma will.
    Kein Support per PN. Fragen bitte im Forum stellen!

    3 Mal editiert, zuletzt von Endor ()

  • Ja ist mir bekannt.

    Tausche ich noch aus.

    Mfg.
    Endor

    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/109.0.1
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/110.0
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/111.0

    OS: Windows 7 64 bit - Irgendwann Windows 10 64 bit wenn Firma will.
    Kein Support per PN. Fragen bitte im Forum stellen!

  • für die 3 Striche unten, Schritt 1 bis 3

    habe ich es hier so gemacht:


    CSS
    [class="indicator current"] {
    background: lime !important;
    }
    
    
    [class="indicator "] {
    background: gold !important;
    opacity: 1 !important;
    }


    Mfg.
    Endor

    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/109.0.1
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/110.0
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/111.0

    OS: Windows 7 64 bit - Irgendwann Windows 10 64 bit wenn Firma will.
    Kein Support per PN. Fragen bitte im Forum stellen!

  • Logo sollte oben jetzt aktuell sein.
    Mfg.
    Endor

    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/109.0.1
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/110.0
    Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:109.0) Gecko/20100101 Firefox/111.0

    OS: Windows 7 64 bit - Irgendwann Windows 10 64 bit wenn Firma will.
    Kein Support per PN. Fragen bitte im Forum stellen!