Recently I had a problem submitting the form I wrote and stared confused at my screen for some time trying to understand, what could be the reason. Let my tell you how I approached the problem and have found a solution. Step 1: Make sure it’s a form This may sound silly if you think […]

Drawing with CSS is a great way of learning CSS properties, possibilities and limits. And it’s a ton of fun too. Let’s create a very simple drawing today – a silly bee. HTML The HTML is very basic and contains only one element with a class, that we will use as a hook: <div class=”bee”></div> […]

One of the CSS things, that keep surprising me even though I have done them many times before is how flexbox affects text alignment. It’s like “Why doesn’t my text-align: center work? Is this a flexbox container thing again?”. Let’s have a look. Text alignment with display: block If you have a heading (h1, h2, […]

Note: this article is mostly about fixing some problems with Internet Explorer, but the technique may be useful in other cases too. The other day I had worked on a website with nice big hero image above the content. The image should have taken the whole width on mobile and stay full-width until it reached […]

I like writing javascript in a progressive enhancement manner – I assume there is some HTML (DOM) to work with and build my javascript magic around it. Autocomplete or validation for an input? Just grab that input and add event listeners to make users’ lives easier. Pagination without reloading the whole page? Intercept the click […]

Creating text decorations with pseudoelements is not new, but it definitely is a nice technique, that is worth knowing. Let’s have a look at a simple example. The result The result we want to achieve looks like this: It is a centered text with horizontal lines to the left and right. The lines are centered […]

Once I got a task of upgrading an old website and making it responsive. Sounds common enough. Decision was made to migrate data to new CMS but keep the old layout, because the client liked it. And he liked it exactly the way it was – every single pixel of it. So the question is: […]

Whenever I open a website and can barely read the text I often think about the WCAG contrast criterion. It sounds pretty simple: The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following: Large Text-Large-scale text and images of large-scale text have a contrast […]

Once you get to know what art direction is, there is no way back. It’s like learning what kerning is. You cannot unsee it. And the most surprising thing about art direction is, that people can understand it without understanding it – their eyes will follow the path you have designed but will have no […]

I like background patterns. They are rather unusual on the web and if I see one in the wild I always smile. If you want to see some examples visit CSS3 Patterns Gallery. All of those patterns are created using linear and radial gradients. When I first started creating some on my own, I found […]