Photo Sandbox

HTMLx

HTMLx2

HTMLx3

HTMLx4

CSSx1

Image Garden

Photo Sandbox

Our Photo Sandbox

Play with the code copied from the Image Garden Tutorial here.
Discover/make up your own.
have fun.

Click on the discussion tab above to leave comments, ask questions ... etc.

---

Paste in some code and play

do it right Here.
wake the kids ... phone the neighbors ... call in sick

Visual Haiku Clone

A haiku is not a poem, it is not literature; it is a hand beconing,

a door half-opened, a mirror wiped clean. It is a way of returning

to nature, to our moon nature, our cherry blossom nature, our falling

leaf nature, in short, to our Buddha nature. It is a way in which

the cold winter rain, the swallows of evening, even the very day in

its hotness, and the length of the night, become truly alive, share

in our humanity, speak thery own silent and expressive lanugage.

~R.H.Blyth~ Haiku, Volume One

Why Are some icicles long Some short? -Onitsura- We are poets and sages in so far as we do not ask such questions, or rather, in asking them we expect no answer and do not desire one. To keep things in this state of wonder and suspense, to want without desire to love deeply without attachment, this is the real part of all our living. Then the different lengths of the icicles, the different heights of wooden pilings, the difference between the sun and the moon, these things are of perpetual and never-ending suprise, for ... "A long thing is ... the Long Body of Buddha; A short thing is ... the Short Body of Buddha." -R.H.Blyth- Haiku Vol4 Autumn/Winter

temp

[[Image:Finger1.jpg ]]
<font color=#777788>
::''little biddy bird
::''arrived and departed
::''like a feathered thought
</font>

Here's "biddy bird"...

little biddy bird

arrived and departed

like a feathered thought

---

[[Image:Finger1.jpg|left|]]
<BR><BR>
<font color=#777788>
::''little biddy bird
::''arrived and departed
::''like a feathered thought
</font>
<br style="clear:both;" /> 

Here's "biddy bird"...

little biddy bird

arrived and departed

like a feathered thought

---

<div style="float:left;">
[[Image:Finger1.jpg|left|]] 
<BR><BR>
<font color=#777788>
::''little biddy bird
::''arrived and departed
::''like a feathered thought
</font>
</div> 
<br style="clear:both;" />

Here's "biddy bird"...

little biddy bird

arrived and departed

like a feathered thought

---

newer experiments

Co-aligning images

---

<div style="float:left;width:200px;"> 

what happens if i put text here?<BR>
the 200px determines how much text fits before it wraps
  [[image:Ice2.jpg|none|thumb|Ice2]] 
and some more here?<BR>
doesn't allow text to the right of the pic
  [[image:Mud3.jpg|none|thumb|Mud]]
and then here too?

</div>
<br style="clear:both;" /> 

what happens if i put text here?
the 200px determines how much text fits before it wraps

Ice2

and some more here?
doesn't allow text to the right of the pic

File:Mud3.jpg

Mud

and then here too?

Experiment, Play, Have Fun

so it appears that if one

uses the left

float in the image then

the pic will align left

and we can add all the

text that we want and it

will end up not below ...

but to the right.

cool!.

hmmmm ...

what about another pic?

yes ... that works as well ... and if you use the "right" float then we can control where it ends up page height wise ... and still have the text end up between the pics and then all the way to the right border as it drops below the right pic ... and then back to the left border when it is lower than that pic.

using "center" float interferes with the text in a way i do not yet understand.

resize?

http://news.povray.org/povray.binaries.images/attachment/%3Cweb.420e337cb5e3aeb1ea506de40%40news.povray.org%3E/par_uni.jpg

http://news.povray.org/povray.binaries.images/attachment/%3C420de19a%40news.povray.org%3E/gnu-tux.jpg

using a table to position external pics

{| 
| http://en.wikipedia.org/upload/b/bc/Wiki.png
| 
| http://en.wikipedia.org/upload/b/bc/Wiki.png
|-
|
| http://en.wikipedia.org/upload/b/bc/Wiki.png
|
|}

gives

http://en.wikipedia.org/upload/b/bc/Wiki.png		http://en.wikipedia.org/upload/b/bc/Wiki.png
	http://en.wikipedia.org/upload/b/bc/Wiki.png width="20"

Similarly

http://meta.wikimedia.org/upload/2/27/Tst.png		http://meta.wikimedia.org/upload/2/27/Tst.png		http://meta.wikimedia.org/upload/2/27/Tst.png
	http://meta.wikimedia.org/upload/2/27/Tst.png		http://meta.wikimedia.org/upload/2/27/Tst.png
http://meta.wikimedia.org/upload/2/27/Tst.png		http://meta.wikimedia.org/upload/2/27/Tst.png		http://meta.wikimedia.org/upload/2/27/Tst.png