Kasper Mikiewicz

Hmm, this one is better, I think :)

.cf:after {
    content: '';
    clear: both;
    display: table;
}

@paprikkastudio And why not? Guys from W3C has created this for devs then why not to use it? Of course this attribute isn't

suitable in many cases but stil, I can find it useful. For example I use it to preload images used in CSS.

<!-- Hidden div to fetch images before CSS needs them -->
<div hidden>
   <img src="img/loader.gif" alt="">
   <img src="img/sprite.png" alt="">
</div>

It's all up to you how you use it :)

Cleaner version :)

function parseTweet(text) {

    var patterns = {
        link: /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig,
        user: /(^|\s)@(\w+)/g,
        hash: /(^|\s)#(\w+)/g
    };
    return text
        .replace(patterns.link,'<a href="$1" target="_blank">$1</a>')
        .replace(patterns.user, '$1@<a href="http://www.twitter.com/$2" target="_blank">$2</a>')
        .replace(patterns.hash, '$1#<a href="http://search.twitter.com/search?q=%23$2" target="_blank">$2</a>');

}

Method 3

$('form').on('submit', function() {

    var $form = $(this);

    $.post( $form.attr('action'), $form.serialize(), function(response) {

        var response = $.parseJSON(response);

        console.log("Response: ", response);

    });

    return false;

});

@pointpointclick And you're right :) read this http://csswizardry.com/2013/01/mindbemding-getting-your-head-round-bem-syntax/

or lorem20 + tab and you have ... :)

Nice, tought i prefer this method:

HTML:

<span class="text--reverse">moc.liame@esrever</span>

CSS:

.text--reverse {
    unicode-bidi: bidi-override;
    direction:rtl;
}

@tmaster, @felipekm How about this?

$.fn.checkboxMaster = function(list) {

    return this.on('click', function() {

        var isChecked = $(list).first().prop('checked');

        $(list).prop('checked', ! isChecked );

    });

}

Here's more universal version:

/**
 * Un/Select multiple checkboxes using one checkbox
 * @param  {jQuery selector} $list List of checkboxes
 * @return {object}
 */
$.fn.checkboxMaster = function(list) {

    return this.on('click', function() {
        $(list).prop('checked', $(this).prop('checked'));
    });

}

Usage:

$('#check_all').checkboxMaster('input[name=vehicle]');

@pe1999 Form elements wasn't my target but you can still use this for elements like this http://i.imgur.com/V80xQVn.png to change sorting of elements on page. Just add "?sort=popular" or "?sort=latest". As you can see, you can still use this to send data via GET method :)

He're some examples of usage:
http://davidwalsh.name/sliding-links
http://designitcodeit.com/item/notifications

Good stuff, thanks for making this clear ;)

@emilnordh Nope, it doesn't support it at all. Usualy *display: inline; is used as fallback for IE7 but in this case it doesn't work.

@nathansmonk It works in IE8+ and any browser that support display: inline-block;

@passcod looks good tought you will be able to center only one element in page. With mine code you can center anything ;)

Chain :)

$('body').css('display', 'none').fadeIn(500);

Also don't overuse var keyword ;)

var $this = $(this),
pos = $this.offset(),
prevFloat = $this.css('float'),
prevZIndex = $this.css('z-index');