newbie: images in table moved

Discussion in 'HTML' started by R.A.M., Nov 15, 2007.

  1. R.A.M.

    R.A.M. Guest

    Hello,
    I have little experience in HTML/CSS and I would like to ask a question. I
    have prepared a table (2x2) of images with captions. Unfortunately images in
    second column are moved down at about 30px.
    Could you explain me why and how to correct it?
    Here's HTML:

    <form id="Form" name="Form">
    <table border="0" width="725px">
    <tr align="center">
    <td align="right" valign="top">
    <a id="Assocatiotion" href="Association.html" title="Association
    &quot;Integration&quot;">
    <p id="AssociationPicture" />&nbsp;<br/>
    <p id="AsociationCaption" />&nbsp;
    </a>
    </td>
    <td align="left" valign="top">
    <a id="Center" href="Center.html" title="Center of psychoterapy">
    &nbsp;<p id="CenterPicture" /><br/>
    &nbsp;<p id="CenterCaption" />
    </a>
    </td>
    </tr>
    <tr align="center">
    <td align="right" valign="top">
    <a id="Club" href="Club.html" title="Club &quot;Amicus&quot;">
    <p id="ClubPicture" />&nbsp;<br/>
    <p id="ClubCaption" />&nbsp;
    </a>
    </td>
    <td align="left" valign="top">
    <a id="Voluntary" href="Voluntary.html" title="Voluntary">
    &nbsp;<p id="VoluntaryPicture" /><br/>
    &nbsp;<p id="VoluntaryCaption" />
    </a>
    </td>
    </tr>
    </table>
    </form>

    Here's CSS:

    #AssociationPicture
    {
    background-image: url('images/Association.gif');
    width: 200px;
    height: 200px;
    }
    #AssociationCaption
    {
    background-image: url('images/Association_caption.gif');
    width: 200px;
    height: 25px;
    }
    #Association:hover #AssociationCaption
    {
    background-image: url('images/Association_over.gif');
    width: 200px;
    height: 25px;
    }
    #CenterPicture
    {
    background-image: url('images/Center.gif');
    width: 200px;
    height: 200px;
    }
    #CenterCaption
    {
    background-image: url('images/Center_caption.gif');
    width: 200px;
    height: 25px;
    }
    #Center:hover #CenterCaption
    {
    background-image: url('images/Center_over.gif');
    width: 200px;
    height: 25px;
    }
    #ClubPicture
    {
    background-image: url('images/Club.gif');
    width: 200px;
    height: 200px;
    }
    #ClubCaption
    {
    background-image: url('images/Club_caption.gif');
    width: 200px;
    height: 25px;
    }
    #Club:hover #ClubCaption
    {
    background-image: url('images/Club_over.gif');
    width: 200px;
    height: 25px;
    }
    #VoluntaryPicture
    {
    background-image: url('images/Voluntary.gif');
    width: 200px;
    height: 200px;
    }
    #VoluntaryCaption
    {
    background-image: url('images/Voluntary_caption.gif');
    width: 200px;
    height: 25px;
    }
    #Voluntary:hover #VoluntaryCaption
    {
    background-image: url('images/Voluntary_over.gif');
    width: 200px;
    height: 25px;
    }

    Thank you!
    /RAM/
     
    R.A.M., Nov 15, 2007
    #1
    1. Advertising

  2. R.A.M. wrote:

    > I have little experience in HTML/CSS and I would like to ask a
    > question. I have prepared a table (2x2) of images with captions.
    > Unfortunately images in second column are moved down at about 30px.
    > Could you explain me why and how to correct it?
    > Here's HTML:


    Don't post code. There could very well be other parts of your page,
    missing here, that affect your problem. Post the URL. We also don't have
    copies of your images, so any testing would be only a guess.

    > <a id="Assocatiotion" href="Association.html" title="Association
    > &quot;Integration&quot;">


    Your spell checker is broken. Where is the CSS for "Assocatiotion" ?

    --
    -bts
    -Motorcycles defy gravity; cars just suck
     
    Beauregard T. Shagnasty, Nov 15, 2007
    #2
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. David Williams
    Replies:
    2
    Views:
    1,145
    Jacob Yang [MSFT]
    Aug 12, 2003
  2. Dave Mehrtens

    Comments Moved in VS.Net

    Dave Mehrtens, Aug 12, 2003, in forum: ASP .Net
    Replies:
    1
    Views:
    348
    Jacob Yang [MSFT]
    Aug 13, 2003
  3. Jeff S
    Replies:
    2
    Views:
    9,814
    David Wier
    Nov 4, 2003
  4. Shaun Dore

    Object moved to here

    Shaun Dore, Nov 12, 2003, in forum: ASP .Net
    Replies:
    1
    Views:
    500
    Oliver
    Nov 13, 2003
  5. Rio
    Replies:
    4
    Views:
    1,217
Loading...

Share This Page