help with html code

Hi Guys,

doing a project for school. Could some one please out line were are the mistakes in this code please.

thanks


<ul id=test>

<li><a href="guitar.html">
<img src="images/guitar.jpg" alt="GUITAR HERO T Shirt Men's Organic Fairtrade Cotton T-Shirt" title="GUITAR HERO T Shirt Men's Organic Fairtrade Cotton T-Shirt" width="160" height="160" />

</a><a id="wrap" href="guitar.html"></a><h2> Club</h2><p>By Paul Dunkel</p><p id="red"><Strong>€29.0</strong></p></li>

tricky D

What exactly are you trying to achieve?

Do you want the image and what text to link to guitar.html?

Re: id vs class:
Will there be more similar list items in the list?
Will there be more similar lists on the page?
Will there be more similar links on the page?

Also to validate your markup: http://validator.w3.org

<li><a href="guitar.html">
<img src="images/guitar.jpg" alt="GUITAR HERO T Shirt Men's Organic Fairtrade Cotton T-Shirt" title="GUITAR HERO T Shirt Men's Organic Fairtrade Cotton T-Shirt" width="160" height="160" />

</a><a id="wrap" href="guitar.html"></a><h2> Club</h2><p>By Paul Dunkel</p><p id="red"><Strong>€29.0</strong></p></li>



Its meant to be a t shirt product in an ul. However I'm not sure if the elements are right or wrong. I tried the validator and found it confusing.

jebuz

A few things...

1. Indent your code, makes it more readable and easier to spot errors (google this if you're not sure what I mean)
2. Ensure quotes always surrounds an around an ID (ul id="test")
3. Always close your tags once you open them, then embed the content. (missing end ul tag)
4. you have a 2nd "guitar.html" link with an id of "wrap" that does nothing because you didn't add anything in between the a tags.
5. consider use of a list here, is it really the best option? are there better alternatives?
6. As mentioned above, if you are using the same style in many places, use the class attribute instead of id when styling an element. This allows you to use a defined style in many places.

Here is your code cleaned up a bit, html is tricky when you first start but keep at it and it will get easier. Experiment with your code but also use w3schools as a reference for learning about new elements it includes good examples too.

<ul id="test">
  <li>
    <a href="guitar.html">
      <img src="images/guitar.jpg" alt="GUITAR HERO T Shirt Men's Organic Fairtrade Cotton T-Shirt" title="GUITAR HERO T Shirt Men's Organic Fairtrade Cotton T-Shirt" width="160" height="160" />
    </a>
    <h2>Club</h2>
    <p>By Paul Dunkel</p>
    <p id="red">
      <Strong>&euro;29.0</strong>
    </p>
  </li>
</ul>

tricky D

First, generally (and keeping it simple) avoid using id unless it is a unique element. Use a class instead.

Assuming the answers to my other questions are:

• img and 'Club' text.
• yes
• yes
• yes

You could use this:

<ul class="test">

<li>

<a href="guitar.html"><img src="images/guitar.jpg" alt="GUITAR HERO T Shirt Men's Organic Fairtrade Cotton T-Shirt" title="GUITAR HERO T Shirt Men's Organic Fairtrade Cotton T-Shirt" width="160" height="160" /></a>

<h2><a class="wrap" href="guitar.html"> Club</a></h2>

<p>By Paul Dunkel</p></a>

<p class="red"><Strong>&euro;29.0</strong></p>

</li> 

</ul>

and change the id selectors in the css to class selectors ie change #wrap, #red and #test to .wrap, .red and .test in the css.

More on this: http://www.w3schools.com/css/css_id_class.asp

Thanks guy,

jebuz cheers for the encouragement