Jump to content

Recommended Posts

Posted

My current Doc Type is:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

 

 

The Validation errors im getting are:

 

 

Line 54, Column 80: attributes construct error

…media icons/twitter.png" width="42" height="41" border="0"alt="twitter" /></li>

Line 54, Column 80: Couldn't find end of Start Tag img line 54

…media icons/twitter.png" width="42" height="41" border="0"alt="twitter" /></li>

 

And so on because of the following:

 

<ul class="social-icons">

<li><a href="#"><img src="images/social media icons/facebook.png" width="42" height="41" border="0" alt="facebook" /></a></li>

<li><a href="#"><img src="images/social media icons/twitter.png" width="42" height="41" border="0" alt="twitter" /></a></li>

<li><a href="#"><img src="images/social media icons/stumble.png" width="42" height="41" border="0" alt="stumble" /></a></li>

<li><a href="#"><img src="images/social media icons/feedburner.png" width="42" height="41" border="0" alt="feedburner" /></a></li>

<li><a href="#"><img src="images/social media icons/vimeo.png" width="42" height="41" border="0" alt="vimeo" /></a></li>

<li><a href="#"><img src="images/social media icons/youtube.png" width="42" height="41"border="0" alt="youtube" /></a></li>

</ul>

 

What gives..... ??

 

If remove "width="42" height="41" border="0"" then a blue border appears around the icons in firefox or any other image that has an <a> attached to it.

Posted

I'm pretty sure you aren't supposed to have 'border="0"' on your images (and you don't have a space between the " and the start of "border" on at least one of your images.)

 

Remove the borders, and add "a img { border:0; }" to your CSS instead.

  • 1 year later...
Posted

Try this

 

<ul class="social-icons">

<li><a href="#"><img src="images/social media icons/facebook.png" width="42" height="41" alt="facebook" border="0" /></a></li>

<li><a href="#"><img src="images/social media icons/twitter.png" width="42" height="41" alt="twitter" border="0" /></a></li>

<li><a href="#"><img src="images/social media icons/stumble.png" width="42" height="41" alt="stumble" border="0" /></a></li>

<li><a href="#"><img src="images/social media icons/feedburner.png" width="42" height="41" alt="feedburner" border="0" /></a></li>

<li><a href="#"><img src="images/social media icons/vimeo.png" width="42" height="41" alt="vimeo" border="0" /></a></li>

<li><a href="#"><img src="images/social media icons/youtube.png" width="42" height="41 alt="youtube" "border="0" /></a></li>

</ul>[/code

 

Let me know. I just found this website looking for explanation about some warning validation :rolleyes: I just decided to register and help others.

  • 3 weeks later...
Posted

try the following in your external css rather than coding atts in the HTML:

 

.social-icons * img { width:42px; height:41px;... }

 

im not positive on this but im thinking that error is because your values do not have expressed units of measure. ie. pt, px, etc

  • 2 weeks later...
Posted (edited)

Kill the height=, width=, border= properties of your images in HTML and use CSS for them

 

a img {border: 0px; height: 41px; width: 42px;}

 

If that doesn't work, it may be because your file path for image contains spaces. This is a general no-no and you should rename the folder that contains them to not have spaces, i.e. /social-media-icons/

Edited by khanahk

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...