Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
kherzog

Code block creating double underline in page links and footer

Question

Site URL: https://www.lynnemeade.com

Hi,

I've turned on "Underline Body Links" option in site styles to go with the website's minimalist design aesthetic. A double underline of these links has arisen when adding code blocks to display a colored background, text and links. In order for the links in these code blocks to have an underline, I've used the code:  p a {text-decoration: underline!important}. Without that code, the links aren't displaying according the link site styles setting.

To view the double underline display issue on a page that has a code block with a link underlined:

https://www.lynnemeade.com/contact

To view the single underline display on a page that has a code block without any links:

https://www.lynnemeade.com/teaching-workshops
 

I've tried various ways to resolve the link problem and am stumped at this point. I would be most appreciative for a way to resolve the double underline display issue.

Thank you in advance,

Karen

Share this post


Link to post

4 answers to this question

Recommended Posts

  • 0
7 hours ago, tuanphan said:

Add to Page Settings > Advanced > Header

(or use Code Block)


<style>
  a {
    border-bottom: none !important;
}
</style>

Thank you for the code @tuanphan. I wished it had resolved the link display issue.

When I inserted the code above in the Page Settings > Advance > Header, the code removed the light grey underline in all links of the Contact page. I've since removed that code and the code to style links in the code block, that is "p a {text-decoration: underline!important;}", so that the black double underline in all links on the page disappears and the site styled gray link underlines remain.

Let's try another approach:

My goals for pages with code blocks with links and light gray backgrounds are to:
1) not affect the light gray paragraph and footer links 
that are styled by the "Underline Body Links" option in site styles
2) style links in code blocks with gray backgrounds with a black underline

How can these two goals be achieved with custom CSS?

I would so much appreciate any guidance. Thank you in advance!

Share this post


Link to post
  • 0
12 hours ago, kherzog said:

Thank you for the code @tuanphan. I wished it had resolved the link display issue.

When I inserted the code above in the Page Settings > Advance > Header, the code removed the light grey underline in all links of the Contact page. I've since removed that code and the code to style links in the code block, that is "p a {text-decoration: underline!important;}", so that the black double underline in all links on the page disappears and the site styled gray link underlines remain.

Let's try another approach:

My goals for pages with code blocks with links and light gray backgrounds are to:
1) not affect the light gray paragraph and footer links 
that are styled by the "Underline Body Links" option in site styles
2) style links in code blocks with gray backgrounds with a black underline

How can these two goals be achieved with custom CSS?

I would so much appreciate any guidance. Thank you in advance!

Try this

<style>
  .code-block a {
    border-bottom: none !important;
}
</style>

 


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

Share this post


Link to post
  • 0
15 hours ago, tuanphan said:

Try this


<style>
  .code-block a {
    border-bottom: none !important;
}
</style>

 

@tuanphan Thank you for updated code. I modified it to display an underline in links in the code block (see below). Adding the modified code to Page Settings > Advanced > Header worked. Hurrah!!

<style>
  .code-block a {
   text-decoration: underline!important;}
}
</style>

I so much appreciate your assistance!

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...