Hyperlinking an Image

Discussion in 'HTML' started by Daniel, Sep 28, 2007.

  1. Daniel

    Daniel Guest

    In a table cell (with a background color) I inserted 2 times the same
    transparent image (side by side). Everything appeared normal.

    I now added a hyperlink to the images and a navy blue border appears
    around each image. I would like to know how to remove the border and
    all styling so that the images butt up against one another again.

    Here is the code for that cell

    <a href="http://localhost/web/insp_add.php?inspid=9">
    <td class="conf" colspan="2" title="Time: 9:15
    Duration: 2:15 hr(s)
    Address: Montréal
    Status: Confirmed">
    <a href="http://localhost/web/insp_add.php?inspid=9">
    <img src="images/inspreq.gif" width="10" height="10"
    hspace="0" vspace="0" align="left"/>
    </a>
    <a href="http://localhost/web/insp_add.php?inspid=9">
    <img src="images/inspreq.gif" width="10" height="10"
    hspace="0" vspace="0" align="left"/>
    </a>
    </td>
    </a>

    I have tried the following in my css file

    link {
    margin: 20px;
    padding: 0px;
    border:none;
    text-decoration:none;
    }

    a {
    text-decoration:none;
    border:none;
    }

    but it doesn't seem to do anything.

    Thank you for your help,

    Daniel
    Daniel, Sep 28, 2007
    #1
    1. Advertising

  2. Daniel wrote:
    > In a table cell (with a background color) I inserted 2 times the same
    > transparent image (side by side). Everything appeared normal.
    >
    > I now added a hyperlink to the images and a navy blue border appears
    > around each image. I would like to know how to remove the border and
    > all styling so that the images butt up against one another again.
    >
    > Here is the code for that cell
    >
    > <a href="http://localhost/web/insp_add.php?inspid=9">
    > <td class="conf" colspan="2" title="Time: 9:15
    > Duration: 2:15 hr(s)
    > Address: Montréal
    > Status: Confirmed">
    > <a href="http://localhost/web/insp_add.php?inspid=9">
    > <img src="images/inspreq.gif" width="10" height="10"
    > hspace="0" vspace="0" align="left"/>
    > </a>
    > <a href="http://localhost/web/insp_add.php?inspid=9">
    > <img src="images/inspreq.gif" width="10" height="10"
    > hspace="0" vspace="0" align="left"/>
    > </a>
    > </td>
    > </a>
    >
    > I have tried the following in my css file
    >
    > link {
    > margin: 20px;
    > padding: 0px;
    > border:none;
    > text-decoration:none;
    > }


    Styling the LINK element eh? They have not visual styling they are
    located in the HEAD portion of a document.

    >
    > a {
    > text-decoration:none;
    > border:none;
    > }


    What you want is:

    /* IMGs that are a child of A, no border */
    a img { border: 0; }


    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
    Jonathan N. Little, Sep 28, 2007
    #2
    1. Advertising

  3. Daniel

    Daniel Guest

    First off, thank you!

    Secondly, I'm (obviously) a novice at CSS. Could you point me to a
    good website or 2 to learn from that cover this type of stuff in
    detail and in plain english.

    Thank you once again it was exactly what I needed.

    Daniel
    Daniel, Sep 28, 2007
    #3
  4. Daniel wrote:
    > First off, thank you!
    >
    > Secondly, I'm (obviously) a novice at CSS. Could you point me to a
    > good website or 2 to learn from that cover this type of stuff in
    > detail and in plain english.
    >
    > Thank you once again it was exactly what I needed.


    We all started at one time.

    Try tutorials at www.htmldog.com

    Although not a great read, but very enlightening each time I refer to it...

    http://www.w3.org/TR/CSS21/cover.html
    Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification

    I find the property index helpful:

    http://www.w3.org/TR/CSS21/propidx.html
    Full property table

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
    Jonathan N. Little, Sep 28, 2007
    #4
  5. Scripsit Daniel:

    > In a table cell (with a background color) I inserted 2 times the same
    > transparent image (side by side). Everything appeared normal.


    For some abnormal values of "normal".

    > I now added a hyperlink to the images and a navy blue border appears
    > around each image.


    Is that your main concern, really? To prevent the user from getting the
    slightest clue of there being a link?

    > <a href="http://localhost/web/insp_add.php?inspid=9">
    > <img src="images/inspreq.gif" width="10" height="10"
    > hspace="0" vspace="0" align="left"/>
    > </a>


    That's particularly bad code - an img element without an alt attribute as a
    link.

    --
    Jukka K. Korpela ("Yucca")
    http://www.cs.tut.fi/~jkorpela/
    Jukka K. Korpela, Sep 28, 2007
    #5
  6. Daniel

    John Hosking Guest

    Daniel wrote:
    >
    > Here is the code for that cell
    >
    > <a href="http://localhost/web/insp_add.php?inspid=9">
    > <td class="conf" colspan="2" title="Time: 9:15
    > Duration: 2:15 hr(s)
    > Address: Montréal
    > Status: Confirmed">
    > <a href="http://localhost/web/insp_add.php?inspid=9">
    > <img src="images/inspreq.gif" .../>
    > </a>
    > <a href="http://localhost/web/insp_add.php?inspid=9">
    > <img src="images/inspreq.gif" .../>
    > </a>
    > </td>
    > </a>


    The validator accepts this as XHTML? A <td> inside an <a>?


    --
    John
    Pondering the value of the UIP: http://improve-usenet.org/
    John Hosking, Sep 28, 2007
    #6
  7. John Hosking wrote:
    > Daniel wrote:
    >>
    >> Here is the code for that cell
    >>
    >> <a href="http://localhost/web/insp_add.php?inspid=9">
    >> <td class="conf" colspan="2" title="Time: 9:15
    >> Duration: 2:15 hr(s)
    >> Address: Montréal
    >> Status: Confirmed">
    >> <a href="http://localhost/web/insp_add.php?inspid=9">
    >> <img src="images/inspreq.gif" .../>
    >> </a>
    >> <a href="http://localhost/web/insp_add.php?inspid=9">
    >> <img src="images/inspreq.gif" .../>
    >> </a>
    >> </td>
    >> </a>

    >
    > The validator accepts this as XHTML? A <td> inside an <a>?
    >
    >


    Wow! Or nested <a>'s I don't think so.....

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
    Jonathan N. Little, Sep 29, 2007
    #7
    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. Nedu N
    Replies:
    5
    Views:
    4,786
    mkr04
    Sep 7, 2006
  2. Gmansky

    hyperlinking to a new page

    Gmansky, Jun 27, 2004, in forum: ASP .Net
    Replies:
    1
    Views:
    543
    EijiTek
    Jun 27, 2004
  3. Nedu N

    Hyperlinking and ASP.NEt Session

    Nedu N, Dec 7, 2003, in forum: ASP .Net Building Controls
    Replies:
    5
    Views:
    139
    Munsifali Rashid
    Dec 9, 2003
  4. Crazy Learner
    Replies:
    0
    Views:
    145
    Crazy Learner
    Jul 22, 2003
  5. Nedu N

    Hyperlinking and ASP.NEt Session

    Nedu N, Dec 7, 2003, in forum: ASP .Net Web Controls
    Replies:
    5
    Views:
    172
    Munsifali Rashid
    Dec 9, 2003
Loading...

Share This Page