Heading One
Whole article is a big link. Lorem, ipsum dolor sit amet consectetur adipisicing elit. Hic eum fuga, animi provident voluptas temporibus molestiae explicabo officiis odio repellendus.
The good code more or less lifted wholecloth from this pen from Adrian Roselli.
Tiles can be made click targets through a number of approaches — make the thing a big link, make the thing a clickable area, or (best?) use CSS to increase the size of the click target. These approaches are used below for testing.
The link wrapper makes for confusing and inaccurate link text. The JavaScript approach lacks semantics and an appropriate mouse cursor and is not tabble without a tabindex attribute. The CSS approach seems to be the cleanest and has the best semantics.
Whole article is a big link. Lorem, ipsum dolor sit amet consectetur adipisicing elit. Hic eum fuga, animi provident voluptas temporibus molestiae explicabo officiis odio repellendus.
Whole article is a big link. Lorem, ipsum dolor sit amet consectetur adipisicing elit. Hic eum fuga, animi provident voluptas temporibus molestiae explicabo officiis odio repellendus.
A JavaScript click target on the whole article. Lorem, ipsum dolor sit amet consectetur adipisicing elit. Hic eum fuga, animi provident voluptas temporibus molestiae explicabo officiis odio repellendus.
A JavaScript click target on the whole article. Lorem, ipsum dolor sit amet consectetur adipisicing elit. Hic eum fuga, animi provident voluptas temporibus molestiae explicabo officiis odio repellendus.
CSS enlarged click target. Lorem, ipsum dolor sit amet consectetur adipisicing elit. Hic eum fuga, animi provident voluptas temporibus molestiae explicabo officiis odio repellendus.
CSS enlarged click target. Lorem, ipsum dolor sit amet consectetur adipisicing elit. Hic eum fuga, animi provident voluptas temporibus molestiae explicabo officiis odio repellendus.
Setting the right
dimension manually. In practice, you could do this via JavaScript.
Header One | Header Two | Header Three | Header Four |
---|---|---|---|
Microsoft row two, col one | data row two, col two | data row two, col three | data row two, col four |
Google row three, col one | data row three, col two | data row three, col three | data row three, col four |