div标签外面的href标签？

Question

I understand that div tags are containers for most tags, such as a href tags... with that said I have a document that works and only functions when the a href tag is around two div tags.

If I adjust the div and a href so that it is w3c compliant, it distorts the website. I could possibly adjust my .js and .css to make it work, but I would like to find an alternate solution. Can I keep the a href tag where it is now?

Thanks for any help or suggestions.

Link Here: http://momentum.freeiz.com/

Code Here:

<a href="hapo.htm" >        
  <div class="boxgrid_slideright">
    <div id="slideshow">
      <img class= "cover" src="images/home/ hapo/0.jpg" width="161" height="107" alt="hapo credit union"/>
      <img class= "cover" src="images/home/ hapo/1.jpg" width="161" height="107" alt="hapo credit union"/>
      <img class= "cover" src="images/home/ hapo/2.jpg" width="161" height="107" alt="hapo credit union"/>
      <img class= "cover" src="images/home/ hapo/3.jpg" width="161" height="107" alt="hapo credit union"/>
      <img class= "cover" src="images/home/ hapo/4.jpg" width="161" height="107" alt="hapo credit union"/>
    </div><!--slideshow--> 
  </div><!--boxgrid-->
</a>

Answer 1

You should style inline elements to behave as block element with css:

CSS:

a.whatever, .boxgrid_slideright, .slideshow {
  display: block;
}

HTML:

<a class="whatever" href="hapo.htm" >        
  <span class="boxgrid_slideright">
    <span id="slideshow">
      <img class= "cover" src="images/home/ hapo/0.jpg" width="161" height="107" alt="hapo credit union"/>
      <img class= "cover" src="images/home/ hapo/1.jpg" width="161" height="107" alt="hapo credit union"/>
      <img class= "cover" src="images/home/ hapo/2.jpg" width="161" height="107" alt="hapo credit union"/>
      <img class= "cover" src="images/home/ hapo/3.jpg" width="161" height="107" alt="hapo credit union"/>
      <img class= "cover" src="images/home/ hapo/4.jpg" width="161" height="107" alt="hapo credit union"/>
    </span><!--slideshow--> 
  </span><!--boxgrid-->
</a>

Answer 2

XHTML 2 was going to allow use of the “href” attribute on any element, allowing for block level anchors and eliminating repetition of the same anchor in some cases or unnecessary additional tags in others. This really made sense, since the “a” tag is just a span, but the only span with an added ability of linking to somewhere else. There is really no special semantic meaning to the “a”, and all links on a page could be found in parsing by finding tags with the “href”. In the early days of the development of HTML 5, the “href anywhere” approach was discussed, and I was excited thinking it was going to be part of HTML 5. At the time, that was the most interesting thing about HTML 5 to me. But “href anywhere” would mean all previous browsers would not be able to see links at all (besides for the ones put in “a” tags for some reason), so the idea was scrapped. Instead, the HTML 5 creators took advantage of an against-spec ability that current browsers already had: block level anchors. Browsers at least back to IE 6 will happily make “flow content” placed in an “a” tag into a link. via - Toby Mackenzie

http://davidwalsh.name/html5-elements-links

http://html5doctor.com/block-level-links-in-html-5/