WordPress Creating three duplicates of single a tag, nesting inside p

1 Views

I’ve been experiencing a very strange error. I created a button set for a website and I ported it into the website I made it for by copying and pasting. There were a couple small issues mostly because of wordpress, and one really big one that I can’t figure out.

Whenever I create an anchor element wordpress copies this a tag element and duplicates it 3 times, one before the element and two after it. It also puts 2/3 of these inside of a p tag.

Read More

Screenies below, please help.

The three made up elements surrounding my one true element

The highlighted element is the one I programmed in, as you can see this element is duplicated three times, one before, two after

Here is the actual code. 

<!-- Here I am testing what happens when I add the anchor element -->

<!-- This results in three duplicates -->
<a href="javascript:alert('button event');" title="test case"><div style="display:inline-block;" class="button button__orange button__large"><h5><span class="icon-newspaper"></span> LEARN MORE</h5></div></a>

<!-- This does not -->
<div style="display:inline-block;" class="button button__orange button__medium button__icon--introduce"><h5><span class="icon-newspaper"></span> LEARN MORE</h5></div>
Post Views: 1

Related posts

1 comment

  1. I was working with my backend developer, and he realized what was causing this problem.

    Apparently, you are not supposed to put an H5 inside of an anchor tag, because it causes weird errors like this one.

    Lesson: Don’t nest headings inside of anchor tag, surround the anchor in the heading tag.

Comments are closed.