Make your own free website on Tripod.com


	General Navigation Buttons	Search button goes here / Contact button goes here

09~May~2007 Wednesday: Molly's Mayhem is finally launching it's official internet debut. At this moment we are only a staff of very few and therefore will not be annually updating right away. We hope to eventually bring you new stories at least once a month but at this time cannot guarantee that satisfaction as we are still under construction. We are open to any and all ideas and prospective writers and would like to hear from anyone who may be interested in becoming a 'shipmate' on our crew. Until such time when we can expand our staff and content, we ask that you remain patient and feel free to contact us with any inquiries. Sincerest apologies and happy sailing! .::.Captain, Chloe Isabella.::.

Bunches of buttons go down this side.	Picture of the Week With Caption Width of this table should be just a slight bit wider than the picture itself.	Mother Goose Mayhem By: The associated press Humpty Dumpty...Jack and Jill...The Old Lady in the shoe...not to mention dear old Mother Hubbard. Sure the children of the human world think of it all as silly~humored rhyme, but the residents of Drury Lane were caught in the middle of what will go down as the greatest, most foul~tasting travesty in history...
	and all this cool stuff just to make sure i can stretch the side buttons the whole way down the page blah blah blah
	and all this cool stuff just to make sure i can stretch the side buttons the whole way down the page blah blah blah
	and all this cool stuff just to make sure i can stretch the side buttons the whole way down the page blah blah blah

Codes for tables;

This is my table!

This is a cell

This is a cell	This is a cell
This is the new row	I'm on the new row, too!

Cellspacing;

This is a cell	This is a cell
This is the new row	I'm on the new row, too!

Cellpadding;

This is a cell	This is a cell
This is the new row	I'm on the new row, too!

Spacing and Padding;

This is a cell	This is a cell
This is the new row	I'm on the new row, too!

Table Size;

This table really long!

Content Alignment;

I'm in the center!

I'm aligned to the right!

I'm on top!
So I start on top!

I'm in the middle

I start at the bottom.

Stretching out rows and columns;
1. rowspan=" " Defines the number of vertical table rows the cell should take up. Place your number inside the quote marks.
2. colspan=" " Defines the number of horizontal columns the cell should take up.

Nice guy, isn't he?
Met him at the store.

Star Wars Folks
Luke Skywalker	Princess Leia	Han Solo

Background Color;

Red Rules!

Cell backgrounds;

red

blue

Row Backgrounds;

red	red again...
blue	blue again!

Table within a table;

I'm inside the small table!

I'm in the first small table! Ha!

I'm in the second small table! Ha, ha!

Resize Cells;

I want two columns the same size.

Well, O.K.

Image maps;

Now you can see where the USEMAP="#mymap" from the IMG tag comes from. The name of the map is "mymap". Now, let's look at what all of this means: This defines your image map section, and gives the map a name. This map is named "mymap". The AREA tag defines an area of the image that will be used as a link. The SHAPE attribute tells the browser what shape the area will be. To keep it simple, I only used "RECT", which stands for rectangle. The COORDS attribute is where we define the edges of each area. Since it is a rectangle, we will use two sets of coordinates. The first set defines where to start the rectangle, where the top-left edge of the rectangle will be. Since this rectangle starts at the top-left edge of the image, the coordinates are (0 pixels, 0 pixels). The second two numbers define where to end the rectangle. This will be the lower-right edge of the rectangle. Remember that the total image size was 200x40. We want the lower-right edge of this rectangle to be halfway accross the image and at the bottom of the image. Going accross, half of 200 is 100, but we use 99 here because 100 can only be used once. We will use it in the second rectangle here. Of course, 40 pixels takes us to the bottom of the image. So the lower-right corner of this rectangle will be 99 pixels accross the image, and 40 pixels (all the way) down the image. And now the easy part: The HREF attribute is used to tell the browser where to go when someone clicks someplace on that rectangle. Put the url of the page you want to go to in there, and the first rectangle is set up! Basically the same as the previous area tag, but it is for our second rectangle. We start where the other one left off, but back at the top of the image. Since the right edge of the last rectangle was at 99 pixels accross, we start this one at 100 pixels accross. And since this will be the upper-left of the second rectangle, we start it at 0 pixels down the image (the top!). We end this rectangle where the image ends, so the lower-right coordinate here is pretty nice- (200, 40), the size of the image! The DEFAULT is not really a new shape, it just covers anything that may have been left out. We didn't leave out anything in this map, but if we had, this would be the url someone would go to if they clicked on any area we did not define earlier. This ends the map section! Now, you can use other shapes besides rectangles, but those are alot tougher to code by hand. I would suggest using a shareware image map creation program if you use other shapes in your map. From what I have heard, a good program for this is called LiveImage. You can get it and see what it can do! So, if you need a simple image map separated into rectangular sections, just do what we did above. You can have as many rectangular areas as you want, just add the extra AREA tags with coordiantes and urls.