Including an inline image in a link Options

[hmlewis19]

I am a novice when it comes to HTML and CSS. So please don't think my questions are stupid!! I need all the help I can get!!

How can I enclose an inline image and paragraph within a link with the href attribute "#".

This is what I have got:

<a href="#"><img src="image5.jpg" alt="" /><br />
<p>
<span>9:30 a.m.</span> It's time to go through
the Keyhole. Be prepared for heavy winds.
</p>
</a>


Could someone please tell me if this is right???

PLEASE!!

Any help would be greatly appreciated....

[Brian Chandler]

What is supposed to be the effect of clicking a link to '#'? I don't think it will take you anywhere....

Otherwise, yes, you can include (almost) any html content within the <a>... </a> tag, and this content will be the stuff that, when clicked, takes you to the place in the href=xyz page.

[Frederiek]

You can't have a block level element (<p>) within an inline element (<a>). The online validator would point that out.

So, you'll have to code it differently. See for an example at http://www.smileycat.com/miaow/archives/000230.php. Here a list is used and an <em> element set to "block".

[Frederiek]

I just found yet another sample site (yet again based on Veerle's blog) at http://samrayner.com/archives/building_a_better_blocklist/.

[Darin McGrew]

Another approach is to restructure your markup. You could move the image and anchor into the paragraph:

CODE

<p><a href="...">
  <img src="..." alt="..."><br>
  <span>9:30 a.m.</span> It's time to go through the Keyhole. Be prepared for heavy winds.
</a></p>

You could create multiple anchors:

CODE

<a href="...">
  <img src="..." alt="...">
</a><br>
<p><a href="...">
  <span>9:30 a.m.</span> It's time to go through the Keyhole. Be prepared for heavy winds.
</a></p>