Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥

Talk dirty to me - Dirty little tricks for comm...

Talk dirty to me - Dirty little tricks for common problems in the front-end development

In this talk I'll go through common problems in the daily front-end development and will show off little nifty techniques to solve them. You know how it works: you're working on an awesome feature for your storefront and you're facing a problem and have no idea how to solve it. Don't waste your time and spend hours trying to find a workaround that probably will never deployed to production. The walks you through the techniques and workarounds I found out the hard way over the last 5 years of front-end development. The talks covers every topic which is common - HTML links can't be nested or how to get all form data without iterating over every field in the form.

Stephan Pohl

May 23, 2016
Tweet

More Decks by Stephan Pohl

Other Decks in Programming

Transcript

  1. #scd16 @klarstil Talk dirty to me #scd16 @klarstil Dirty little

    tricks for common problems in the front-end development.
  2. #scd16 @klarstil 1. Man kann Typographie relevante Properties auf <img>

    Elemente setzen 2. Das <img> Element ist ein "ersetztes" Element Zwei Fakten über <img> Elemente
  3. #scd16 @klarstil Erster Ansatz - Trennzeichen • Funktioniert nicht in

    Blink-basierten Browsern. • Trennzeichen sind sprachabhängig. • Browser-Support je nach Sprache eingeschränkt.
  4. #scd16 @klarstil Zweiter Ansatz - overflow-wrap • Support in jeden

    von "caniuse.com" gelisteten Browser. • Browser (IE) benötigen "word-wrap"
  5. #scd16 @klarstil Dritter Ansatz - truncate • Support in jeden

    von "caniuse.com" gelisteten Browser. • Wörter / Sätze werden nach einer Zeile gekürzt • Wörter werden nicht sinnig getrennt
  6. #scd16 @klarstil "Ghost"-Element Ansatz Wenn man ein "Ghost"-Element in das

    Eltern-Element setzt, kann man den gleichen Effekt erreichen!