There are many different ways to change fonts on a page. Using MooTools allows us a fancy variety of options. Use morphing to smoothly transition from one text size to the next.
To be ready to transition font size, the layout must be liquid. A liquid layout is one that can grow without breaking the display. Create styles that would alter the size of the text.
<div id="main" class="medium"> <form action="" method="get" id="font_sizer"> Choose text size: <input type="button" id="small" value="S"/> <input type="button" id="medium" value="M" disabled="disabled"/> <input type="button" id="large" value="L"/> </form> <h1>Welcome!</h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec auctor est. Aenean neque sem, vulputate quis ultrices quis...etc, homma homma. ... </div> <style type="text/css"> #main { margin:0 auto; width:780px; padding:10px; ...