Extend clickable area via CSS #css #html #integration

index.html

<div class="container">
  <h1>foo</h1>
  <p>bar</p>
  <p><a href="#" class="container_link">baz</a></p>
</div>

main.css

.container {
  position: relative;
  
  &_link {
    text-decoration: none;
    
    &::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
    }
    
    &:hover,
    &:focus {
      text-decoration: underline;
    }
  }
}