www.webdeveloper.com
Results 1 to 3 of 3

Thread: how do i put an image and text both in the same <a> link

  1. #1
    Join Date
    Nov 2012
    Posts
    2

    how do i put an image and text both in the same <a> link

    here is the code:

    [CODE]<a href="strategy-tips.html">
    <img class="buttonTips"src="images/smallgrey_button.png" width="240" height="50" alt="" />
    <div class="textTips">ADDITIONAL TIPS</div>
    </a>[/CODE

    it is the image of a button, with text on the top. what is the correct way to have both the image and text going to strategy-tips.html ?

    as the w3.org validator is showing the following error:

    http://s18.postimage.org/5gziymnyw/validator_error.jpg

  2. #2
    Join Date
    Nov 2012
    Posts
    2
    cant find an edit button, so posting it again as it should be

    here is the code:

    Code:
    <a href="strategy-tips.html">
    <img class="buttonTips"src="images/smallgrey_button.png" width="240" height="50" alt="" />
    <div class="textTips">ADDITIONAL TIPS</div>
    </a>
    it is the image of a button, with text on the top. what is the correct way to have both the image and text going to strategy-tips.html ?

    as the w3.org validator is showing the following error:

    [IMAGE]http://s18.postimage.org/5gziymnyw/validator_error.jpg[/IMAGE]

  3. #3
    Join Date
    Sep 2008
    Location
    Dallas
    Posts
    154
    Just looking at your code, it should work fine. The reason you're getting errors while validating is you have a block element (<div>) inside an inline element (<a>). If you want it to semantically validate, make your <div> a <span>, and in your CSS, display your <span> as block.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles