Design issue (Text overlap)

Looking for your response.

Hello Ahtisham,

At first glance, that would appear to just be that you have one status set to 100% and another that is set to very close to 100% (e.g. 95%). And, since they’re so closed together, they overlap. You could either decrease the percentage of the other status or you can use CSS to hide the 100% status. If you want to do the latter, then can you please provide me a working order number, so I can see the results page and provide you with the CSS?

• This reply was modified 4 years, 3 months ago by jaysupport.

Hi, Yeah sure.
Here is the order number: e5000059
And here is the link to the page: https://d42.gotomy.dev/fixmob/tracker/

Also, I’ve checked the other case mentioned by you as well. But the completed status is 100% and the failed status is set to 0% but it is still overlapping the texts.
Please check the screenshot of backend status setting here: https://nimb.ws/NGa3fj

Thanks!

• This reply was modified 4 years, 3 months ago by Ahtisham.

Something is not right in the way you have it configured. If you look at the following screenshot, you’ll see that “Failed” is set as the ending status… So the percentages are not set up correctly for at least one of your statuses.

With that in mind:

– Make sure you don’t have two statues with the same percentage.
– Make sure you only write a number in for the percentage (i.e. don’t write in the percentage sign).

• This reply was modified 4 years, 3 months ago by jaysupport.

Hi,
Sorry for the delay. I haven’t configured according to my settings. The plugin is currently working with the default status settings.
Please have a look on this screenshot: https://nimb.ws/ZeKIjy

There are only 3 statues with the 0 percentage. I tried by changing each of them but it is still overlapping the design for me in the frontend.
Please share your email address with me so I can able to share the backend credentials to you so you can check the backend status settings accordingly.

Thanks.

• This reply was modified 4 years, 3 months ago by Ahtisham.

Please do not offer your credentials or access to your admin. That is against WordPress guidelines and not something we can accept or do.

Don’t have more than one status with the same percentage, especially not for 0 or 100.

Try this: Remove all your statuses and create three new ones. One at 0, one at 50 and one at 100. Then set an order to the 50% status. What does that look like?

Hi,

I’ve removed all the statuses from the backend and added 3 new statuses with the same percentage you mentioned.
Check in this screenshot: https://nimb.ws/21qxPo

After this, I create a new order with the 50% (Processing) order status and it looks like this: https://nimb.ws/oQUI5t

But when I updated the status to 0% (Failed). The same overlapping case appears.
You can check it here: https://nimb.ws/lYO7vo

Please check this case.
Thanks!

In that case, you’ll likely just need to add some CSS to force the ewd-otp-current-status selector to never be more than a certain amount left or right. For example:

#ewd-otp-current-status {
margin-left: 150px;
margin-right: 150px;
}

If that doesn’t work, you’ll need to set the order you provided to us (e5000059) to a status that causes the issue, so I can inspect the source code of the page and suggest alternative CSS.

• This reply was modified 4 years, 3 months ago by jaysupport.