t3n News Entwicklung

Flexbox: Neuer Open-Source-Editor für den CSS-Layoutmodus

Flexbox: Neuer Open-Source-Editor für den CSS-Layoutmodus

Ein quelloffener Drag-&-Drop-Editor erlaubt es auch Nicht-Entwicklern Flexbox-Layouts zu erstellen. Wir haben uns das Tool für euch angeschaut.

Flexbox: Neuer Open-Source-Editor für den CSS-Layoutmodus

Flexbox. (Grafik: Instacod.es)

Flexbox: Einfacher Editor für den CSS-Layoutmodus

Mit CSS-Layoutmodus Flexbox könnt ihr Elemente innerhalb eines Containers für unterschiedliche Bildschirmgrößen positionieren. Der US-amerikanische Entwickler Brian Diehr hat jetzt einen einfachen Editor entwickelt, mit dem ihr Flexbox-Layout bequem per Drag-&-Drop erstellen könnt. Anschließend braucht ihr nur noch den fertigen und HTML-Code zu kopieren.

Ein einfacher Editor für den CSS-Layoutmodus Flexbox. (Screenshot: )
Ein einfacher Editor für den CSS-Layoutmodus Flexbox. (Screenshot: briandiehr.com)

Über den Flexbox-Editor könnt ihr Einfluss auf die einzelnen Elemente nehmen und so beispielsweise die Ausrichtung oder die maximale Größe festlegen. Alle Änderungen werden automatisch in fertigen CSS-Code übernommen. Den Quellcode der Web-App hat Diehr auf GitHub veröffentlicht.

Flexbox: Weitere Informationen zu dem CSS-Layoutmodus

Wollt ihr mit Flexbox durchstarten, solltet ihr euch den unten eingebundenen Video-Workshop anschauen. Noch ausführlicher ist dieser 20-teilige Flexbox-Videokurs. Wer sein wissen lieber spielerich erweitert, der kann außerdem einen Blick auf das Lernspiel Flexbox Froggy werfen.

via www.webdesignernews.com

Vorheriger Artikel Zurück zur Startseite Nächster Artikel
Eine Antwort
  1. von grep am 09.01.2016 (01:07 Uhr)

    Hallo ...,


    jene, welche nicht affin mit (X)HTML, CSS, etc. sind, sollten sich betreffendes Wissen einfach aneignen anstatt alternativ entsprechende Werkzeuge zu nutzen ... (welche dann gewünschten Codes erzeugen sollen)!

    Nur so 'ne Idee !


    Ciao, Sascha.

    Antworten Teilen
Deine Meinung

Bitte melde dich an!

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden

Mehr zum Thema CSS
SlackAlert: Open-Source-Button bringt den Messenger in die echte Welt
SlackAlert: Open-Source-Button bringt den Messenger in die echte Welt

SlackAlert ist ein kleiner Hardware-Button, mit dem ihr eine vordefinierte Slack-Nachricht absenden könnt. Hard- und Software des Projekts sind Open Source. » weiterlesen

Open-Source-Alternative zu Typeform: TellForm in der Kurzvorstellung
Open-Source-Alternative zu Typeform: TellForm in der Kurzvorstellung

TellForm ist eine quelloffene Alternative zu Typeform. Wir haben einen Blick auf den Formular-Generator geworfen. » weiterlesen

Open-Source-Alternative zu Franz: Rambox vereint mehr als 20 Messenger
Open-Source-Alternative zu Franz: Rambox vereint mehr als 20 Messenger

Rambox vereint Messaging-Dienste wie Whatsapp, Facebook, Slack, Hipchat und viele andere unter einem Desktop-Interface. Das Ganze erinnert stark an den Multi-Messenger Franz – mit einem Unterschied. » weiterlesen

Alle Hefte Jetzt abonnieren – für nur 35 €

Kennst Du schon unser t3n Magazin?