Do you know how to fix this error?

Arkidas · #1 09-27-2008, 09:14 PM

[Invalid] Markup Validation of http://malesopranos.com/forums - W3C Markup Validator

I had a coder make a 'Latest Videos' module in my sidebar. However, he made one error ( it says 15 because there are 15 thumbnails. It's not really an error but it makes my site non-xhtml validated everywhere ).

I guess it's an easy fix but I know very little about this. Here's the template:

HTML Code:

<div class="videoBox">
<a href="$tube[link]"><div style="position: relative"><img width="60" height="45" alt="$tube[title]" src="$tube[link1img]" /><div style="position: absolute; width: 60px; height: 60px; top: 0px; left: 0px; background: url(/images/styles/sopranos/style/corners_vid.png) no-repeat;"></div></div></a>
</div>

Note that a dummy image is used to make thumbnails rounded and that's why there are two divs.

Shadab · #2 09-28-2008, 02:50 AM

A <div> can't be put inside an anchor <a href="">.

So, try this :

HTML Code:

<div class="videoBox">
   <div style="position: relative">
      <a href="$tube[link]">
         <img width="60" height="45" alt="$tube[title]" src="$tube[link1img]" />
      </a>
      <div style="position:absolute;width:60px;height:60px;top:0px;left:0px;
         background: url(/images/styles/sopranos/style/corners_vid.png) no-repeat;">
      </div>
   </div>
</div>

or this :

HTML Code:

<div class="videoBox">
   <a href="$tube[link]">
      <img width="60" height="45" alt="$tube[title]" src="$tube[link1img]" />
   </a>
</div>

briansol · #3 09-28-2008, 03:27 AM

yup... you can't put a block-level element (the div) into an inline element (the a)

I think the best way to mark that up would be:

Code:

<div class="videoBox">
    <a href="$tube[link]" class="tubeanchor"><img src="$tube[link1img]" width="60" height="45" alt="$tube[title]" /></a>
</div> 


.tubeanchor {
    width: 60px;
    height: 60px;
    background: url(/images/styles/sopranos/style/corners_vid.png) no-repeat;
    padding: 7px 0;
    margin: 0;
    border: 0;
}

Obviously, place the CSS class into your MAIN CSS extras box (at the bottom), not in the template itself.

untested- might need a tweak.

Arkidas · #4 09-28-2008, 08:44 AM

Thanks to both of you

!

Brian's solution would probably be cleanest if it'd work but for some reason the corners weren't smooth with it.

The solution below ( Shadab's first solution ) seems to work perfectly but I'd still like to use Brian's if he can figure out what's wrong with it since it's a bit cleaner.

HTML Code:

<div class="videoBox">
   <div style="position: relative">
      <a href="$tube[link]">
         <img width="60" height="45" alt="$tube[title]" src="$tube[link1img]" />
      </a>
      <div style="position:absolute;width:60px;height:60px;top:0px;left:0px;
         background: url(/images/styles/sopranos/style/corners_vid.png) no-repeat;">
      </div>
   </div>
</div>

Arkidas · #5 10-06-2008, 08:04 PM

Apparently, this solution above doesn't really work. it removes the link on the image, making it the thumbnails quite useless. I'm quite surprised I just noticed this now. Any suggestions?

Arkidas · #6 10-17-2008, 04:40 PM

Any way to remove the error without removing any functionality?

Arkidas · #7 10-27-2008, 01:31 PM

Last try

.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Parse error: syntax error, unexpected T_CONSTANT_ENCAPSED_STRING	muhakeme	Türkçe	9	09-15-2008 02:05 PM
[Error] xhtml coding error on my part - please help	jbartle	Template Modifications	3	01-24-2008 11:50 PM
Internal Server error - Log error posted here	candg	Troubleshooting	2	08-06-2007 06:46 AM
vBSEO error in error log	Mert Gökçeimam	Troubleshooting	5	02-26-2007 11:41 AM

SEO

Do you know how to fix this error?

Do you know how to fix this error?

Similar Threads