SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Addict
    Join Date
    Apr 2004
    Location
    PA
    Posts
    250
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Image Link <a> tag or <div>

    Quick question on a simple image link.

    I have a view cart Icon I want to put on my site, and maybe a few others. Initially I wanted to put it in the drop down menubar, but I couldn't seem to get that to work. Once I floated it right it caused a problem.

    Regardless, I have put it in my subheader now. You can see the example here:

    http://www.evolutionmsport.com/evm-page2.php?pag=3

    I used a simple html tag:

    <a style="float:right; padding-right:5px;" href=http://www.evolutionmsport.com/evm-catalog/index.php?main_page=shopping_cart><img src="images/evmCartO.gif" width="75" height="31" border="0"></a>

    Is there a better way to do this? I have seen some threads where they talk about creating a <div> and used the image as a background. Is that a cleaner way to do this. I may end up with a few buttons in the subheader (all floated right), or the menubar (if I could figure that out).

    So, are there any issues with the way I am doing it (browser support, etc) or should I try the div with a background????

    Thanks....Mike

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,784
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    Hi Mike,

    I'm a firm believer in that if the image is important to the page and conveys meaning/content/functionality then it should be in the foreground in the html.

    If the image is for presentation (nice colour etc) then it should be in the background in the css.

    An easy way to make your mind up is to say would the page work (make sense) without this image at all. If the answer is yes then it goes in the background. If the answer is no then it goes in the foreground.

    The advantage of foreground images is that you can give them alt and title tags as well so that if the image doesn't load you will still see some info about ther image. Unlike a bg image which will just be missing.

    Paul

  3. #3
    SitePoint Addict
    Join Date
    Apr 2004
    Location
    PA
    Posts
    250
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B
    Hi Mike,

    An easy way to make your mind up is to say would the page work (make sense) without this image at all. If the answer is yes then it goes in the background. If the answer is no then it goes in the foreground.

    Paul
    Paul,

    Thanks...I like your reasoning, its nice and sound...I think I will stick with it as it is....Is there any benefit to wrapping the image itself in a div, or just leave it as it is, with the image floated right? I may add a second image on the same line which I will float right as well.....

    Thanks again.....Mike
    Last edited by EvM-Mike; Jul 12, 2004 at 06:59. Reason: spelling

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,784
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    Is there any benefit to wrapping the image itself in a div
    Only if you have problems with padding and margins on images as some ie browsers can be a little strange.

    If it looks ok then its probably ok so don't waste extra mark up.

    Paul

  5. #5
    SitePoint Addict
    Join Date
    Apr 2004
    Location
    PA
    Posts
    250
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B

    If it looks ok then its probably ok so don't waste extra mark up.

    Paul
    Cool....Thanks again....

    Mike


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •