Positioning of image

[Neatoboy]

Hi

I'm trying to position the clipart forklift (under the menu) on the left hand side so that it sits at the bottom of the cell, while the menu sits at the top of the cell:

http://www.forkserve.com.au/index-new.htm

What am I doing wrong?

[coothead]

Hi there Neatoboy,

What am I doing wrong?

Well,the worst thing that you have done, is to use javascript for you navigation.

Those with it disabled will be stuck on that page.

I would then suggest that your use of tables for page layout is inappropriate.

• Why tables for layout is stupid: problems defined, solutions offered
• Ten ways to speed up the download time of your web pages
• Nested Tables: About the (ab)use of tables as layout tools in webpages.
• Why Tables Are Bad (For Layout) Compared to Semantic HTML + CSS
• Why go table free?
• Why avoiding tables (for layout) is important

All is not lost, though, as the attached zip file has a total reworking of your page.

[Neatoboy]

Thank you for your assistance! I've looked at the code you sent on the revised website, but I don't understand how you have "told" the image to render next to the footer. Can you try and explain this to me?

[coothead]

Hi there Neatoboy,

in the index.html file you will see <div id="content"> which contains the left side navigation and the right side text.

Underneath those two areas are...

<img id="forklift" src="images/forklift.jpg" alt="forklift">
<img id="footer" src="images/footer.gif" alt="footer">

The <div id="content"> is given the attribute position:relative in the main.css file.

The two images are given the attribute position:absolute.

The forklift image is placed bottom:0 and left:0.

The footer image is placed bottom:0 and right:0.

This means that the images will always be stuck at the bottom of the <div id="content">
whatever the height of the left side navigation or right side text.