Jan Quickels // communicate.create.inspire: Interaktive Kommunikation, On- und Offline Publishing

Suche & Services

Web-Typography Tool: CSS-Typeset Matrix and code generator

Matrix zum berechnen von Schriftgrößen und Zeilenabstand in em und px
Font size (px) Font-size Margin Asymmetrical Margin
Top Bottom Top Bottom
px em px em px em px em px em px em
----------
0000
0000
0000
0000
0000
0000
0000

Sourcecode Symetrical Margins:

body { font: normal em/em Arial,Verdana,sans-serif; } 
html>body { font-size: px; } 
p { margin: em  0; font-size: em; line-height: em; }
h1 { margin: em 0; font-size: em; line-height: em; }
h2 { margin: em 0; font-size: em; line-height: em; }
h3 { margin: em 0; font-size: em; line-height: em; }
h4 { margin: em 0; font-size: em; line-height: em; }
h5 { margin: em 0; font-size: em; line-height: em; }
h6 { margin: em 0; font-size: em; line-height: em; }

Sourcecode Assymetrical Margins:

body { font: normal em/em Arial,Verdana,sans-serif; } 
html>body { font-size: px; } 
p { margin: 0em 0 0em 0; font-size: em; line-height: em; }
h1 { margin: 0em 0 0em 0; font-size: em; line-height: em; }
h2 { margin: 0em 0 0em 0; font-size: em; line-height: em; }
h3 { margin: 0em 0 0em 0; font-size: em; line-height: em; }
h4 { margin: 0em 0 0em 0; font-size: em; line-height: em; }
h5 { margin: 0em 0 0em 0; font-size: em; line-height: em; }
h6 { margin: 0em 0 0em 0; font-size: em; line-height: em; }

The Web-Typography tool is also featured on following sites. Thanks for the support and recommendations!