38 users online (0 members and 38 guests)  


  Results 1 to 4 of 4

Related

  1. CSS Image Pop Up - Positioning    Forum: CSS Forum
    Replies: 1
  2. Image Positioning    Forum: HTML Forum
    Replies: 4
  3. image positioning    Forum: HTML Forum
    Replies: 1
  1. #1
    Neatoboy's Avatar
    New User

    Status
    Offline
    Join Date
    Mar 2008
    Posts
    9

    Positioning of image

    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?

  2. #2
    coothead's Avatar
    bald headed old fart

    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    732

    Re: Positioning of image

    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.

    All is not lost, though, as the attached zip file has a total reworking of your page.
    Attached Files Attached Files
    Last edited by HTML; 03-09-2012 at 10:58 AM.

  3. #3
    Neatoboy's Avatar
    New User

    Status
    Offline
    Join Date
    Mar 2008
    Posts
    9

    Re: Positioning of image

    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?

  4. #4
    coothead's Avatar
    bald headed old fart

    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    732

    Re: Positioning of image

    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.



Tags for this Thread