links to css and javascript

I am having trouble with what should be a simple task!

On my webpage, I have this link:

<a class='action' href='javascript:void(0)' OnClick='run()'> run </a> 

Along with the following CSS:

.action {
    color: #e17009;
    text-decoration: underline;
    font-size: 80%;
}

Despite specifying the color as #e17009, it stubbornly displays in black. Changing other properties like size works fine, but not the color?

This link is dynamically generated using jQuery and is refreshed periodically, but I don't believe that should have any impact on the issue.

Answer №1

The reason your color declaration is not taking effect is due to a previous directive that is overriding it or being ignored. To solve this issue, consider modifying the selector to a.action for better specificity or using color: #e17009 !important;. If these solutions do not work, you can check the parsed CSS values using Firebug.

Answer №2

Attempt to clear your browser's CSS cache by pressing CTRL+F5. If the issue persists, use Firebug to inspect the link and identify which CSS class is causing the link color to appear black.

Answer №3

It's puzzling that this is labeled as jQuery tagged, but your anchor should be formatted as follows:

<a class='action' href='#' OnClick='run();return false;'> run </a>

Answer №4

My recommendation aligns with Réjôme's suggestion to utilize Firebug. It seems likely that upon loading this css, another file is being loaded which is causing the anchor color to be overridden. With Firebug, you can easily identify the source of the color.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

A simple method for bulk editing in Angular UI Grid

Is there a way to enable mass editing in Angular UI Grid by allowing all rows to show editable input fields at once, rather than just one at a time? I have searched online for a solution without success and am now turning to this forum for help. If anyone ...

The background image fails to display properly on the server in Next.js

Hello, I'm currently using NextJs and I have a challenge. I want to set a background image on the body element that is rendered server-side. Below you'll find my code snippets: First, here is my App.js: import BodyStyle from '@components/Bo ...

Obtaining your CSGO inventory via Steam API using jsonp: A step-by-step guide

Hey there! I'm currently facing an issue while trying to access a player's CSGO inventory using Valve's API. Unfortunately, I keep running into the error message stating that no 'access-control-allow-origin' header is present on th ...

Having trouble with JSON/jQuery syntax?

I am attempting to populate a set of DIVs with image backgrounds by reading images from a specific folder. The jQuery code I have written is shown below: $.getJSON('../functions.php', function(images) { images.each( function() { $('#m ...

Integrating jQuery into the functions.php file of a Wordpress

I have been using a jQuery script in Unbounce and now I want to implement it on my Wordpress page. I believe I will have to insert this into the child theme functions file, but I know it requires some PHP code as well. As I am still fairly new to this proc ...

"Enhance your data management with Laravel and Vue.js by incorporating the powerful Matfish Vue-Table

Currently, I am utilizing matfish-vue-table2 along with server-side implementation. Below is my Laravel controller where I am able to retrieve the JSON response from the 'api/articles' URL: public function index() { $articles = Article::orde ...

What steps can be taken to restrict a user's access to the main page unless they are logged in?

I have created sign up and login pages using JavaScript, HTML, and PHP with a database. After a user successfully logs in on the login page, the following code is executed: sessionStorage.setItem('logged','loggedIn'); The user is then ...

Map Loader for GeoJson Leaflet Integration

Although my English skills are not perfect, I will do my best to explain my issue. I have some knowledge of javascript / html / ajax and I have created a webgis using Leaflet. The problem arises when loading a large geojson file onto the map - it takes qui ...

Is your CPU overheating due to IE7, encountering script issues, and need help with debugging

My current web design project is running smoothly on all Mac browsers and Windows Firefox, Chrome, and IE 8. However, I'm facing significant issues with IE 7. Despite having the CSS almost in place with a few adjustments needed, the CPU usage spikes t ...

The product has been taken out of the cart, yet it has not been reinserted into the cart

The product disappears from the cart after clicking on Add to Cart, but it doesn't reappear when clicked again. //function for adding only one item to cart document.getElementById('btn1').onclick = function() { addItemToCart() }; fun ...

The comparison between installing a JavaScript library and simply copying .js files

As I dive into the world of web development and JavaScript, I've noticed that many open-source JavaScript libraries like jqueryUI come with readme files containing installation instructions. These instructions often mention the need to install additio ...

Creating my website with a unique inverse color scheme

I'm looking to change the color scheme of my webpage so that it is inverse (white becomes black and black becomes white) similar to the Dark Reader chrome extension: https://chrome.google.com/webstore/detail/dark-reader/eimadpbcbfnmbkopoojfekhnkhdbiee ...

Validation of HTML forms through JavaScript

I'm working on form validation and struggling with implementing preg_match check from a variable. Currently, I can validate empty fields successfully, but that's not sufficient. Any suggestions on how to proceed? var pattern = /([a-zA-Z0-9]|[a-z ...

Tips for accessing information from an Angular Resource promise

I am currently facing an issue when trying to read data from an angular promise that was returned. Before, I had the following code: var data = category.get({id:userid}); Later, I realized that the data being returned was an unresolved promise. So, I ma ...

The left-floated image extends beyond the boundaries of the div

I have a situation where text and an image are combined but the cat image goes outside of the parent div. Is there a solution to this issue? View the code here <div style="border:1px solid #CCCCCC"> <img style="float: left;" src="http://plac ...

Visual traceroute, like the one on "yougetsignal.com", provides a way to update a div element either on demand or periodically

This is my very first question on a forum, yay! I will do my best to ask clearly and concisely. I am currently working on creating a visual traceroute similar to the one found on yougetsignal.com by Kirk Ouimet. My project is up and running using bash co ...

What could be the reason for the NODE_DEBUG=fs environment variable not working as expected?

According to the Node.js documentation on the fs module at https://nodejs.org/api/fs.html#fs_file_system: To obtain a trace back to the original call site, you can set the NODE_DEBUG environment variable: Here is an example of setting the fs environmen ...

Utilizing JQuery for adjusting the CSS top property

I needed to overlay text on an image, so I used CSS for this purpose. However, as I incorporated Bootstrap and hesitated to include absolute positioning in the CSS file, I faced issues with centering the text when resizing the image. To tackle this problem ...

How long does jQuery animation last until completion?

Within my project, I am utilizing the animationComplete function from the jQuery mobile library. You can find this function at The animation in my project involves a sequence of objects with various tasks to be executed at each point of the animation. The ...

Automatically integrating Nivo Lightbox into your website

I incorporated Nivo Lightbox into my website, seamlessly integrating all images with the plugin using the following code: <div class="portfolio-item"> <div class="portfolio-thumb "> <a class="lightbox" data-lightbox-type="ajax" title="Strat ...