Back to the homepage.

Without hanging punctuation:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sagittis mauris ut nisi cursus eleifend. Sed non est eu augue vestibulum malesuada ut non purus.

Hanging punctuation with a pseudo-element:

$('.pseudo q').exdent({ detect: true });

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sagittis mauris ut nisi cursus eleifend. This works also in the middle of the text. Try to resize the window to bring this quote to the left border. Sed non est eu augue vestibulum malesuada ut non purus.

Setting the exdent width explicitly:

$('.hardcoded q').exdent({ by: '.4em' });

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sagittis mauris ut nisi cursus eleifend. This works also in the middle of the text. Try to resize the window to bring this quote to the left border. Sed non est eu augue vestibulum malesuada ut non purus.

Exdenting <span>s by the length of the string "This ":

$('.a-span span').exdent({ detect: 'This ' });

This is a span. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sagittis mauris ut nisi cursus eleifend. This works also in the middle of the text. Try to resize the window to bring this span to the left border. Sed non est eu augue vestibulum malesuada ut non purus.

Using jQuery’s $.css():

$('.cssHook q').css('exdent', '.4em');

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sagittis mauris ut nisi cursus eleifend. This works also in the middle of the text. Try to resize the window to bring this quote to the left border. Sed non est eu augue vestibulum malesuada ut non purus.