There are wonderful times for us web-designers. CSS3 has finally arrived and it’s here to stay. With an equal high support among all modern browsers we have great possibilities right at our fingertips.
css3files.com is not only here to guide you through the often dense jungle of the CSS3 syntax, but it also wants you to encourage to use CSS3 right now! Don’t care about the old Internet Explorers, a website hasn’t to look the same in every browser.
“You are nothing without your tools”. Although this sentence is a bit rough, it also bears some truth. Nobody can do good work, if she hasn’t proper tools to aid the creation process. Like at every other profession, there are also tools that aid us web designers at our work. Through the course of my career I have used many of them, some of them longer, some shorter. But recently I really contracted a passion for a few tools I use.
The trickiest part in responsive design in my eyes is the handling of the navigation of a website at narrow viewports. Since vertical space is precious here, it’s not optimal to just depict all items, since they can take up a considerable amount of space. Therefore there are roughly two main types of how the navigational items are handled at “small” screens. The first represents the “nav icon” – usually three horizontal lines -, the second is to “pack” all the items into a select box as soon as a certain width gets undershot.
Do you know this problem: You see something, a whole design, an element, on another website and think “Wow, this looks great, I’d like to employ that in a future project of mine.” And then, the big moment comes, when you start to layout a site and want to use the named “inspirational object”. You try and try, you move elements across the screen, you test different styles, but the end result is never quite the same like you have seen it on this other side. The “spark” misses. But why is this so?
After a long time I’ve once again written a lengthy article for a commercial magazine. Since I’ve tinkered with Flexbox lately, I decided to write about this layout method. Although it should initially be published by the .net magazine there was a little misunderstanding in the end and so SitePoint gladly released it. You can read the article here.
There are certain code patterns which you need again and again as a web-designer. One of them is probably an image bar with some images located side by side. This by itself isn’t difficult, but if you need a fixed width for the whole bar you have to do some calculations, especially when gaps are involved. Wouldn’t it be nice to be able to specify a percentage for the images, for example 25% if you want four images side by side, and also define a gutter absolutely independent from this total width? Well, then read on please.