Mobile Friendly Website

CSSPLAY

Doing it with style

CSS DEMOSCSS3 Resize

Date : 20th May 2011

For all modern browsers




Blow, Blow, Thou Winter Wind

William Shakespeare

Blow, blow, thou winter wind,
Thou art not so unkind
As man's ingratitude;
Thy tooth is not so keen
Because thou art not seen,
Although thy breath be rude.
Heigh-ho! sing heigh-ho! unto the green holly:
Most friendship is feigning, most loving mere folly:
Then, heigh-ho! the holly!
This life is most jolly.
Freeze, freeze, thou bitter sky,
Thou dost not bite so nigh
As benefits forgot:
Though thou the waters warp,
Thy sting is not so sharp
As friend remember'd not.
Heigh-ho! sing heigh-ho! unto the green holly:
Most friendship is feigning, most loving mere folly:
Then, heigh-ho! the holly!
This life is most jolly.

Seven Ages Of Man

William Shakespeare

All the world's a stage,
And all the men and women merely players,
They have their exits and entrances,
And one man in his time plays many parts,
His acts being seven ages. At first the infant,
Mewling and puking in the nurse's arms.
Then, the whining schoolboy with his satchel
And shining morning face, creeping like snail
Unwillingly to school. And then the lover,
Sighing like furnace, with a woeful ballad
Made to his mistress' eyebrow. Then a soldier,
Full of strange oaths, and bearded like the pard,
Jealous in honour, sudden, and quick in quarrel,
Seeking the bubble reputation
Even in the cannon's mouth. And then the justice
In fair round belly, with good capon lin'd,
With eyes severe, and beard of formal cut,
Full of wise saws, and modern instances,
And so he plays his part.
The sixth age shifts
and mere oblivion,
Sans teeth, sans eyes, sans taste, sans everything.





Information

Just exploring the possible uses of the CSS3 'resize' style.

The three boxes above can be expanded in a similar way to form text input boxes, and you can style these to expand vertically or horizontally or both.

So if you are using Firefox 4, Safari or Chrome then just grab the bottom right corner of these boxes and drag them to resize. The first two resize vertically and the third resizes in both directions.


Because of all the time and effort spent in producing this demonstration I would ask that you respect my copyright.

  1. If you are using this on a personal web site then please retain the copyright comment in the stylesheet.
    A support donation is now required for this demonstration.
  2. If you are using this on a commercial web site, or as a paying job for a client, then please email me asking for permission - stu{at}cssplay.co.uk and again a support donation is required.
  3. If you are having problems integrating any of my demonstrations into your website then I now offer a service to fault find and correct any errors that you may have introduced. Please email me for more information.

Support CSSPLAY

Your donations keep CSS PLAY running.
If your donation is for the use of a demo then please email me with the demo url after making your donation.


CUSTOM SEARCH

Facebook Twitter rss feed Facebook Fan Page