One button not displaying properly

Hello I have a row with 4 columns with buttons. The first button does not appear properly, but the other 3 are perfect. Can you please advise how to fix.

I already purged cache etc.

Hi Dutt,

Thanks for writing in. Have you tried deleting the first button and then replaced it with a duplicate of the other buttons?

You can also try copying the style of the other buttons, you can do it by right-clicking on one of the three buttons then click Copy, then after that right-click to the button that is not displaying properly and then click Paste Style.

If the issue is still there after doing this. Please send us a URL of the webpage that is having this issue, so that we can investigate further.

Thanks!

Still not working. Here is the url. See the first button in the second section. https://lawyersfind.org/

Hi Dutt,

I checked your page and the styling is not being applied to the first button, this could happen when there is an invalid HTML code on the page, please check the content of your page and look out for any missing or invalid character.

Also check the button’s settings, sometimes giving wrong color codes also creates this issue. If this doesn’t help then please get back to us with the URL/User/Pass of your WordPress dashboard using the Secure Note functionality of the post to follow up the case.

Thanks!

thanks please see the secure note, it is still not working and I checked for errors and color issues.

Hi Dutt,

I checked and it’s kind of weird, my first time seeing this kind of issue. Any button added there displays without styling, I have deleted and re-added and still the same. But, any button added next to that faulty one works okay. So I went ahead and duplicated the button and hidden the first one. I’ll continue checking, the duplication and hiding is the temporary workaround for now.

Thanks!

thanks for your help. Is this a temporary solution?

Hello Jeff,

We do not have any solution even temporary yet. We are yet to investigate more into this issue.

Please bear with us. Thank you for your understanding.

Thanks, but now I am having even more issues suddenly. Now my page is messed up much worse.

All the sections after section 3 on the main page lawyersfind.org are screwed up. I cant even explain what is wrong with them. i didnt do anything. I just came today and saw it looked like this.

Can you please take a look.

Hello Dutt,

I have inspected your page and I found out that you added this in the featured boxes:

<p style="text-align: justify;">The directory is organized by city and practice type so you can find the closest lawyer for your matter. Our lawyer directory includes cities in every province.</p>
<p style="text-align: justify;">Every law firm in the LawyersFind Canadian lawyer directory is checked to confirm that they are licensed to practise law by their provincial regulator.</p>
<p style="text-align: justify;">LawyersFind will show you a list of law firms, important details about those law firms, and a law firm&#8217;s contact information so you can book a first consultation.</p>

You are not suppose to add <p></p> in there because the output will be wrap with the tag already. Adding them right now has made the tag invalid because you are having this in the output:

<p class="x-feature-box-text" style="color: hsl(0, 0%, 100%);">
<p style="text-align: justify;">LawyersFind will show you a list of law firms, important details about those law firms, and a law firm&#8217;s contact information so you can book a first consultation.</p>
</p>

Keep in mind that you cannot nest P tags. It will messed up other tags as well. I also noticed that you added this:

<p><span style="color: #ffffff;">Ontario</span><br />
<span style="color: #ffffff;">Quebec</span><br />
<span style="color: #ffffff;">British Columbia</span><br />
<span style="color: #ffffff;">Alberta</span><br />
<span style="color: #ffffff;">Prairies</span><br />
<span style="color: #ffffff;">Maritimes</span><br />
<span style="color: <strong> More</strong></span></p>

The correct one should be this:

<p><span style="color: #ffffff;">Ontario</span><br />
<span style="color: #ffffff;">Quebec</span><br />
<span style="color: #ffffff;">British Columbia</span><br />
<span style="color: #ffffff;">Alberta</span><br />
<span style="color: #ffffff;">Prairies</span><br />
<span style="color: #ffffff;">Maritimes</span><br />
<span style="color: #fff;"> <strong> More</strong></span></p>

You added a bunched of <span style="color: <strong> More</strong></span></p>. You will need to edit your page and fixed this html tags that you have inserted.

1 Like

you fixed it! Thanks so much. Great help.

You are most welcome. :slight_smile:

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