Which is the proper way?

  • mista-two-k
  • Beginner
  • Beginner
  • mista-two-k
  • Posts: 57

Post 3+ Months Ago

Hey everyone,

Currently, I insert my images with the following code:

Code: [ Select ]
<div class="overlay alignleft" style="width:200px; height:180px;>
    <a href="big.jpg" title=""><div class="some class"></div></a>
    <img src="thumb.jpg" alt="" />
</div>
  1. <div class="overlay alignleft" style="width:200px; height:180px;>
  2.     <a href="big.jpg" title=""><div class="some class"></div></a>
  3.     <img src="thumb.jpg" alt="" />
  4. </div>


But I read somewhere that you should never put a block level element <div> inside an inline level element <a>. My WordPress theme is XHTML. So my question now is whether the above mentioned code is considered as OK in perspective on an XHTML document. If not, could anyone suggest me a better way?

Thanks
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • Bigwebmaster
  • Site Admin
  • Site Admin
  • User avatar
  • Posts: 9089
  • Loc: Seattle, WA & Phoenix, AZ

Post 3+ Months Ago

You could use a span tag instead and apply whatever class you want to that. Those are allowed inside <a> elements.
  • mista-two-k
  • Beginner
  • Beginner
  • mista-two-k
  • Posts: 57

Post 3+ Months Ago

Hi, thanks for replying.

I tried replacing the div with a span tag, but now the hover isn't properly positioned. The thing is, I have an image overlay which nicly cover the whole image on hover. But when using the span tag it is slightly off-set...?

Is it bad to use the code I am currently using?

Thanks
  • Bigwebmaster
  • Site Admin
  • Site Admin
  • User avatar
  • Posts: 9089
  • Loc: Seattle, WA & Phoenix, AZ

Post 3+ Months Ago

In your CSS, apply this to the span tag:

display:block;

That may resolve your issue.

Post Information

  • Total Posts in this topic: 4 posts
  • Users browsing this forum: No registered users and 43 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.