Hacker News Reader

Comment by robocat | Hacker News Reader

Related question: what is the easiest way to increase the tap zone of a HTML element using CSS?

Aside: I have noticed Safari auto-inceases the touch zone for inputs and elements with ontouch/onclick events (I noticed because I had to fix an issue caused by this!)

View on HN

a {padding: 1rem}

This increases area by padding the link. Just don’t want the rap areas of different elements to overlap with too much padding.

You can also put a border around the new area, or a box shadow, to indicate larger click area, making it a button sort of:

{border: thin solid grey}

Note that the <a> element is inline by default, which means top and bottom padding is not applied. Set display: inline-block; to have padding apply all around while retaining the element’s flow in the layout.

Thank you! I’m still learning CSS and will have to adjust my style sheets! :)

Probably just add some extra "padding: 5px". All the padding area registers "clicks" for the element.

For the thread collapsing functionality I think the long press/touch could mitigate the need for pinch zooming. Just hold your thumb on the comment long enough and bang, it's gone. For me this is the most commonly performed interaction with the site.

I find this behavior on Reddit annoying when I’m reading a long comment and the thread suddenly collapses because I left my finger on the screen. There’s pros and cons to the approach.

Reply on news.ycombinator.com