Focus Outline in Automatic CSS deaktivieren

Sie nutzen Automatic CSS (ACSS)* und fragen sich, warum auf Ihrer Website ein roter Rahmen (Outline) erscheint, wenn Sie z. B. ein Formularfeld anklicken?

In diesem Beitrag erfahren Sie, wie Sie die Focus Outline in Automatic CSS ganz schnell deaktivieren.

Schritt 1 – AutomaticCSS Einstellungen

Öffnen Sie dazu AutomaticCSS* und klicken Sie auf den Reiter “Additional Styling”.

Schritt 2 – ACSS Focus Outline deaktivieren

Unter dem Punkt “Accessibility” finden Sie 4 wichtige Einstellungen:

• Focus Style: Hier können Sie zwischen “Outline” und “Shadow” wählen.
  Mit Outline erreichen Sie eine klassische Umrandung, mit Shadow wird ein Schatten hinter der Box erzeugt.
• Focus Color: Wählen Sie die Farbe der Kontur aus
• Focus Width: Wählen Sie die Breite, also die Dicke der Konturlinie
• Focus Offset: Hiermit bestimmen Sie, wie viel Abstand zwischen der Box und der Umrandung liegen soll

Wenn Sie nun die Werte bei Focus Width und Focus Offset jeweils auf 0 setzen, ist das Problem gelöst, und um die Box erscheint keine Umrandung mehr.

Ihnen hat dieser Beitrag gefallen und Sie wünschen sich weitere Tutorials zum Bricks Builder?
Hinterlassen Sie uns gerne einen Kommentar oder schreiben Sie uns eine E-Mail.
Hier erfahren Sie, wie Sie mit dem Bricks Builder eigene Blöcke erstellen.

Falls Sie nur die Farbe der Outline ändern möchten, können Sie einfach eine andere Variable auswählen oder den gewünschten HEX-Wert festlegen.

Wenn etwas bei Ihnen nicht funktioniert hat, hinterlassen Sie uns gerne einen Kommentar.