Wrapping block elements with a link – auto formatting problem (wpautop?)


I’m having some trouble wrapping blocks with a tags in the WordPress editor. I have been using a visual editor for quite a while, but tired of it, I am switching back to all manual coding – so this issue will force me to change some design / development aspects of my future sites. Below is a very basic example of the intended HTML markup:

<a href="#"><div><h4>test</h4></div></a>

When switching to the visual editor or updating the page, the editor strips out the link:


I believe (please correct me if I’m wrong) HTML5 standards allow for us to wrap block elements with links and will validate, so why is this happening? The same happens when using an icon class to wrap a block element. Removing the wpautop filter does not help (nor would I want to disable). Have tested on a fresh install and can be replicated.

Any thoughts / help would be appreciated.