background preloader

Tips and tricks

Facebook Twitter

A new micro clearfix hack. The clearfix hack is a popular way to contain floats without resorting to using presentational markup.

A new micro clearfix hack

This article presents an update to the clearfix method that further reduces the amount of CSS required. Demo: Micro clearfix hack Known support: Firefox 3.5+, Safari 4+, Chrome, Opera 9+, IE 6+ The “micro clearfix” method is suitable for modern browsers and builds upon Thierry Koblentz’s “clearfix reloaded”, which introduced the use of both the :before and :after pseudo-elements. Here is the updated code (I’ve used a shorter class name too): This “micro clearfix” generates pseudo-elements and sets their display to table. Including the :before selector is not necessary to clear the floats, but it prevents top-margins from collapsing in modern browsers. It ensures visual consistency with other float containment techniques that create a new block formatting context, e.g., overflow:hiddenIt ensures visual consistency with IE 6/7 when zoom:1 is applied.

Modern.IE: Testing made easier in Internet Explorer. Email Address Encoder. A Simple Parallax Scrolling Technique. Parallax scrolling is an interesting technique, where, as you scroll, the background images translate slower than the content in the foreground, creating the illusion of 3D depth.

A Simple Parallax Scrolling Technique

As I planned to re-design my personal website, my first goal was to write the shortest and simplest code to achieve maximum awesomeness! I'll show you how I did it. In this tutorial, I'll teach you the simplest parallax scrolling technique you've ever came across, so let's dig in! This technique revolves around controlling the speed of background image. So let's begin with the HTML markup, creating two sections along with the required attributes: "data-type" and "data-speed". I am using the <section> tag with the attributes data-type & data-speed, which were introduced in HTML5. According to the specification for Custom Data Attributes, any attribute that starts with data- will be treated as a storage area for private data. I know what you're thinking: you're worried about IE.

Now it should look like this... Shapecatcher: Draw the Unicode character you want! Vérifiez la compatibilité navigateur, test de navigateur et de plate-forme. - Browsershots. Web Development Tools. 17,.67,.83,.67) ✿ Ultimate IE6 Cheatsheet: How To Fix 25+ Internet Explorer 6 Bugs. InShare33 The best strategy for dealing with Internet Explorer 6 is not to support it.

Ultimate IE6 Cheatsheet: How To Fix 25+ Internet Explorer 6 Bugs

Stop. Ok, I feel your frustration. You're a web developer and you're ready to tear your hair out because you have to support Internet Explorer 6, but, to put it tactfully, IE6 doesn't support you. You've spent hours on it, but you just can't seem to get your layout right. This isn't one of those rants about IE6 or a campaign to try to kill it. I've scoured the web for resources and also included some of my own fixes for IE6 and now I've put it all together in this cheatsheet/reference manual as a resource for anyone who has to deal with Internet Explorer 6. This massive IE6 guide took a while to put together, so bookmark it, share it, tweet it, and use it to save yourself and your coworkers hours of screaming at your monitor and banging your head against your desk or other inanimate objects. Update: Yann Faurie has graciously provided a French translation of this article. Table Of Contents Strategies. PunyPNG - PNG Compression and Image Optimization - Gracepoint After Five.

Convertisseur de caractères et de codages Unicode. Fake images please? {placekitten}