Double style displaying

http://b-fast.org.uk/all-courses

If you see any text links on this page they have a greeny yellow underline.

Now click on Course Details. You’ll see that all the Full Syllabus links are double underlined. I can’t work out why.

Help to remove this extra formatting would be appreciated. Thanks

Updates to the post:

Read only link: Webflow - b-fast

Browser: Chrome, Firefox, Safari - all display same problem

Screen shot:

Also, the tabs themselves should have no bottom border but are displaying a bottom green border.

Thanks.

Hi @BFast I’m happy to take a look. Can you please update your post following these guidelines: Posting Guidelines for the Design Help Category - General - Forum | Webflow

Thanks in advance! :slight_smile:

I posted this months ago and still have the problem. I updated the post back in March as requested but so far still no help. Please can you look at the problem. thanks.

Hi @BFast

You have a P tag in an A tag with a classname of textlinks. Remove that class name from that element and you should be good to go :smile:

​Try these steps and let me know if you’re successful.

1 Like

Hi

Thanks but if I remove that text links class the top line disappears and the lower line remains where as i want the extra lower line to disappear and the upper line to remain. Also, the other places, for example the footer links, don’t have that class that i can see so it must be in something else. I have had a really good look but i can’t locate which style it is that holds that second lower green line.

Please could you take another look for me?

There’s only one line in my screen:

That’s weird. I’ve tried 4 different devices and all show the double line problem. But it’s kind of comforting to know at least some people might be getting a single line view!

Still hoping someone can help please :smile:

Thanks.

I’ve checked on another browser on my mobile and see the double line.
Try using some unique classes on the link, style that individually from the

.

Or put in custom code:

<style>
    .w-inline-block {
        border-bottom:0;
    }
</style>

That should solve it as well. Although it will mess up other parts of the site ;). So use a different class

Hi @BFast, there is a custom code widget, being used in one of your columns on your page:

It is having some custom border styling that is being added to the A links class, to add border. The textlinks class is nested inside of the A Link, so that is why there are double borders, it seems to me.

I would remove the following styles from the embed widget:

  border-bottom: 2px solid #cad444;
  border-radius: 10px;

Then wait for changes to save and republish your site. Then check again and see if there is any issue.

Cheers,
Dave

1 Like

Fantastic, thank you. That seems to have worked.

1 Like