Jump to content
Sign in to follow this  
Happy_coder_UK!!

Bootstrap 4 css issue

Recommended Posts

Hello all

I created a pretty simple portfolio site using Bootstrap 4.

The CSS styles were brought in using the CDN 'https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css'

I have overwritten a number of styles using scss/css and it's always been a simple task to to do this.

But I have a number of links within bullet points which have retained the default blue colour from the bootstrap CSS. It's fine in Chrome and Firefox but not in Safari (13.1).

In my global scss file, I have used the codeĀ 

.a{

color: $primary-color !important;

}

But for the links within the li bullet points, the blue colour is retained. For all the other links, in <p> tags, the primary-colour is successfully displayed to overwrite the blue colour.

Surely all the links on the site should have the primary colour applied to the text. See below for the html code:

<div class="col-lg-4">
<p>xxxxxx</p>
<ul class="custom-bullet">
<li>xxxx <a href="https://www.xxxx" target="_blank"> xxx</a> xxxx xxxx</li>
<li>xxxx <a href="https://www.xxxx" target="_blank"> xxx</a> xxxx xxxx</li>
<li>xxxx <a href="https://www.xxxx" target="_blank"> xxx</a> xxxx xxxx</li>
<li>xxxx <a href="https://www.xxxx" target="_blank"> xxx</a> xxxx xxxx</li>
</div>

I have tried using divs and classes to use the specificity rules but nothing seems to overwrite the link default colours.

When I start up a local server in Safari, I don't have a problem. It's only when I apply the code to the live site that I have the above issue. I have googled the issue but can't see a workaround to the problem.

I'd really appreciate any help on this.

Regards
Sean

Share this post


Link to post
Share on other sites

Are you able to use the DOM inspector to see which styles are being applied?

Edit: Considering Safari is the one with the problem, have you cleared the browser's cache? I am aware that Safari has a very aggressive cache.

Edited by Ingolme

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...