Docs

[Naturalife]

Hello,

I wanted to format the links on specifically my blog posts.

To make them have a green dotted underline, I was given this code by one of your support members:

.single .entry-content.content a {
    border-bottom: 1px dotted hsl(137,95%,32%);
}

The problem is, this code applies to all links in my posts including my social media buttons and images with links. I only want this styling to apply to text. Any suggestions?

Thank you,
Cameron

Sample:http://naturalife.org/natural-remedies/remedies-increase-energy-fight-fatigue

[Rupok]

Hi Cameron,

Thanks for writing in! It’s because the plugin you are using adding the social share button within the content area that’s why it;s being affected. Let’s add this as well :

.single .nc_socialPanel a {
  border-bottom: medium none !important;
}

Cheers!

[Naturalife]

Thank you for the speedy response! Assuming that works (haven’t tested it yet), how would I apply the no dotted underline to images with links?

[Lely]

Hello There,

You’re welcome!
Unfortunately, right now, I am a little confused with your question. Can you clarify a bit more which image is in question on what page. Which image is showing a dotted underline? I can’t find it on the link provided. This will help us give you a more specific suggestion.

[Naturalife]

Sure here’s an example: http://naturalife.org/natural-product-reviews/fitness-and-health-gifts

Ideally I would like to combine a piece of code so that both images and the buttons don’t have a dotted underline.

Thanks!

[Jade]

Hi there,

Please find this code and remove it from the customizer:

.single .entry-content.content a {
    border-bottom: 1px dotted #049f30;
}

Hope this helps.

[Naturalife]

Would that remove the dotted underline on my text links though?

[Joao]

Hi There,

Please try:

.single .entry-content.content a {
    border-bottom: 1px solid #049f30;
}

Hope it helps

Joao

[Naturalife]

Unfortunately, that still isn’t the solution to my issue.

Let me paraphrase the problem:

I want to keep the dotted underline I have for textual links in my posts / articles. But I want to remove the dotted underline that shows up on link images and the social share buttons on my posts.

The code you provided only changed the code from dotted to solid.

Thank you for your time,
Cameron

[Thai]

Hi There,

Please try with this CSS instead:

.single .entry-content.content a:not(.x-img-link) {
    border-bottom: 1px dotted hsl(137,95%,32%);
}
.single .entry-content.content .nc_socialPanel a {
    border: none !important;
}

Hope it helps 🙂

[Naturalife]

Ahhh at last! Thank you, that worked!

[Prasant Rai]

You are most welcome. 🙂

[Author]

Posts