CODEWITHSUNDEEP
htmlmarkupw3c-validation
jvc26
jvc26

Reputation: 6503

HTML Valid method to implement this following

Running the Ubuntu cloud page http://www.ubuntu.com/business/cloud/overview through http://validator.w3.org/ gives several errors, the majority of which are centred around not having <divs> and <h>s etc. within an <a> tag.

The implementation I'm interested in is the four boxes with arrows, which change colour as you hover over them (as they are <a> links). What is the valid method to implement this?

Upvotes: 1

Views: 51

Answers (2)

bobince
bobince

Reputation: 536379

Valid ways to implement this:

  • separate links inside each block. Put the :hover effect on the parent div, not the link. Downside: more markup

  • use only inline elements inside a single link, using CSS to change them into display: block elements if necessary. Downside: potentially less semantic

  • use an HTML5 doctype, as [X]HTML5 allows this construction. Downside: the less easy-to-validate current moving-target nature of HTML5.

Upvotes: 1

SamT
SamT

Reputation: 10610

Each one of those can be a (with a :hover effect to change the background color/image), and the , which sits inside, just covers the entire div with a height and a width in your CSS.

Upvotes: 0

Related Questions