CSS

play

Experiments with Cascading Style Sheets

• CSSPLAY.BIZ
• HELP & ASSISTANCE
• FAQs
• CONTACT ME
• PRIVACY POLICY
• SITE MAP
• ACCESSKEYS
• SUPPORT
• 

• Demos
• Menus
• Layouts
• Boxes
• Mozilla
• Explorer
• Opacity
• Javascript

• HOME
• LIST
• PREVIOUS
• NEXT
• LAST
• COMMENTS
• TUTORIAL

"I shall have to wait until I catch up with it," said Winnie-the-Pooh. "Now, look there." He pointed to the ground in front of him. "What do you see there?"
"Tracks," said Piglet. "Paw-marks." He gave a little squeak of excitement. "Oh, Pooh! Do you think it's a--a--a Woozle?"
"It may be," said Pooh. "Sometimes it is, and sometimes it isn't. You never can tell with paw- marks."
With these few words he went on tracking, and Piglet, after watching him for a minute or two, ran after him. Winnie-the-Pooh had come to a sudden stop, and was bending over the tracks in a puzzled sort of way.
"What's the matter?" asked Piglet.
"It's a very funny thing," said Bear, "but there seem to be two animals now. This--whatever-it-was--has been joined by another--whatever-it-is-- and the two of them are now proceeding in company. Would you mind coming with me, Piglet, in case they turn out to be Hostile Animals?"
Piglet scratched his ear in a nice sort of way, and said that he had nothing to do until Friday, and would be delighted to come, in case it really was a Woozle.
"You mean, in case it really is two Woozles," said Winnie-the-Pooh, and Piglet said that anyhow he had nothing to do until Friday. So off they went together.

Information

This is my attempt at improving the original idea by Eric Meyer which can be seen at ragged float and the alternative method proposed by 'flumpcakes' at ragged float II.

This is a method of tracking text to an image so that the image remains visible whilst the text aligns itself with the edge of the image.

Both these methods have problems when css is turned off.

Eric's will display a sliced image horizontally across the screen, whereas flumpcakes will not display any image.

This version however will display the image followed by the text.

It is also easier to set up as it does not require the image to be sliced but instead uses variable sized em tags to push the text right.

Copyright

You may use this method on your personal 'non-profit' web site without seeking my permission. A link back to CSSplay is always appreciated.

Commercial usage is also permitted without seeking approval, but I would ask that a donation is considered to support my work on CSSPlay.

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.