CODEWITHSUNDEEP
html
user1058275
user1058275

Reputation: 179

<a href> tag surrounding multiple elements somehow

Somehow the a href is also surrounding the 'update' image but the href is clearly closed with a </a> tag. It is in a list <li> but I don't see how or why this is happening. Has anyone ran into this before where the link tag is surrounding multiple elements?

<a href="cart.php?delete">

<img border="0" src="post_delete_icon.png">
</a>
<br>
<br>
<input type="hidden" value="1" name="item_qty[96]" size="4">
<input id="qtyx" type="text" value="1" name="qtyx" size="4">
<input type="hidden" value="96" name="productidx">
<input type="image" border="1" src="update.png">

Upvotes: 0

Views: 410

Answers (1)

Cory Danielson
Cory Danielson

Reputation: 14501

Which doctype are you using?

Based on your markup, you should be using the HTML5 doctype. If you are unfamiliar with this, place it at the top of your html markup.

<!DOCTYPE html>

and modify your code to:

<a href="cart.php?delete">
    <img src="post_delete_icon.png" alt="delete item">
</a>

<br>
<br>
<input type="hidden" value="1" name="item_qty[96]">
<input id="qtyx" type="text" size="4" value="1" name="qtyx">
<input type="hidden" value="96" name="productidx">
<input type="image" src="update.png" alt="update cart">

Edit:
Since you are using the strict doctype, you need to end your tags and follow the strict doctype rules. Run your code through an XHTML/HTML markup validator in order to make sure your code is compliant.

Because you are writing HTML markup, you want to use the following doctype

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

After you do this, you will need to remove all of the border="0" attributes within your code. Those kinds of things are reserved for CSS when using the strict doctype. Along with the strict doctype, you will need to supply an alt value for your <img> tag. This is to improve usability and sort of a fault tolerance if the image doesn't load.

You can also stick with the XHTML doctype that you are using, but you will have to change your markup in order to follow those rules. Each doctype has it's own rules and changing doctypes in the middle of a project can completely change the way your page is rendered by the browser.

Valid XHTML Strict code:

<a href="cart.php?delete">
    <img src="post_delete_icon.png" alt="delete item"></img>
</a>
<br />
<br />
<input type="hidden" value="1" name="item_qty[96]"></input>
<input id="qtyx" type="text" value="1" name="qtyx" size="4"></input>
<input type="hidden" value="96" name="productidx"></input>
<input type="image" src="update.png"></input>

Upvotes: 2

Related Questions