Allow users to resize text on the page via button controls.

In this instance, users can decrease text, increase text, or reset it back to normal.

Set default text size with CSS

The default text size must be set using an internal stylesheet in the header of your page. In this case: font-size: 1.125em (aka, 18px).

Set the controls with JavaScript

Then we set the resize controls with JavaScript. In this example, we're resizing all text within the div with an id of "content".

The controls check the current text size, and then changes it (or not) accordingly.