:before and :after

Back to the index.

This is a test of :before and :after, with which you can place text or an image before and after each HTML element.

Testsheet:

p.test:before {
	padding-right: 5px;
	content: url(/pix/logo_ppk.gif);
}
p.test:after {
	font-style: italic;
	content: " and some text after.";
}

Test paragraph with class="test".

Dynamic

When we create an extra paragraph with class="test", the :before and :after styles should be applied to it. All browsers do so.

Create an extra paragraph with class="test".