For outputting a given String in HTML, you mostly want to replace line breaks with or tags.

hackernoon.com

CSS Flexbox has become extremely popular amongst front-end developers the last couple of years. This isn’t surprising, as...

jsfiddle.net

When you need test images, instead of using services like lorempixel or placehold.it you may generate test images yourself.

web.archive.org

wrap the text with a span use line-height for the spacing between lines ("margin")

When you print (or print preview) and elements are cut off (e.g. after 1st page, or "randomly") you should check...

By default, browsers will not wrap text at syllable boundaries. Text is wrapped at word boundaries only. This card explains...

makandra dev

An end-to-end test (E2E test) is a script that remote-controls a web browser with tools like Selenium...

Slides for Henning's talk on Sep 21st 2017. Understanding sync vs. async control flow Talking to synchronous (or "blocking...

If you are using PDFKit / wkhtmltopdf, you might as well want to use custom fonts in your stylesheets. Usually this...

reactarmory.com

The linked article shows how to exploit websites that include unsanitized user input in their CSS. Although the article often...

makandra dev
inclusive-components.design

Hack to implement an inverted "night mode" theme with a few lines of CSS. Colors in images are preserved.

gist.github.com

Here is some JavaScript code that allows you to click the screen and get the clicked element's text contents...

Sometimes you add Paperclip image styles, sometimes you remove some. In order to only keep the files you actually need...

I needed to make sure that an element is visible and not overshadowed by an element that has a higher...

This is useful if, for example, you want to use a background-image that has to scale with the width...

philipwalton.github.io

Solved with flexbox is a collection of css problems which were hard or impossible to solve without flexbox: Better, Simpler...

Some pseudo-elements need to be addressed with vendor prefixes. E.g. ::selection is not supported by Firefox, you need to...

stackoverflow.com

iOS Safari tries to be helpful and enlarges some(!) texts when you turn to landscape mode. In precise CSS building...

makandra dev

Just dumping this in case somebody might need it. When you need a CSS value (a padding, margin, height etc...

makandra dev
brunildo.org

The pages listed here contain tests and experiments about features, possibilities, browsers’ bugs concerning CSS. That is, over 200 experiments...

makandra dev
iamvdo.me

Line-height and vertical-align are simple CSS properties. So simple that most of us are convinced to fully understand...

TLDR: When you put CSS rules into a partial and import that partial multiple times, the CSS rules will be...

smashingmagazine.com

A comprehensive introduction to sending HTML emails. Intro: HTML email: Two words that, when combined, brings tears to a developer...

makandra dev
medium.freecodecamp.com

The linked article states that CSS breakpoints should group "similar" screen sizes and thus be at: 600px "narrow"