How to make an element of link block unclickable?

Hi! Can you help me? I have a link block with two paragraphs. How to make so that when we hover paragraph1 block the mouse cursor is common, but if we hover paragraph2 block it is clickable as a parent link block ?

Anything inside a link block will make the cursor catch the link on :hover.

Unless you separate the paragraph you want to exclude from the block and position it with position:absolute where it should appear.

structure would be:

wrapper div (position relative)
– link block
– – p 2 (clickable, with a padding on top to leave room for p1)
– p1 (position absolute and moved on top of p2 and white background (if link block bg is white)

On second thought, this works but isn’t clean because semantically your paragraphs are inverted. Rather do:

wrapper div (position relative)
– p1 (position absolute and moved on top of p2 and white background (if link block bg is white)
– link block
– – p 2 (clickable, with a padding on top to leave room for p1)

But if I were you I’d put as much as link blocks I need to avoid having an absolute positionned element.

1 Like

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.