Struggling to remove the translucent effect when hovering over the share button

I have been struggling with a seemingly simple issue for a few hours now.

On my website, I have some share buttons located at .

Although I want these buttons to remain completely black when hovered over, they are inexplicably becoming slightly transparent during hover. I've tried various solutions, but nothing has worked so far.

.a2a_button_facebook path:hover{
opacity:1 !important;
color:black !important;
fill:black !important;
}

.addtoany_list.a2a_kit_size_32 a:hover{
opacity:1 !important;
color:black !important;
fill:black !important;
}

.a2a_svg a2a_s__default .a2a_s_twitter .a2a_img_text:hover{
opacity:1 !important;
color:black !important;
fill:black !important;
}

.a2a_svg svg:hover{
opacity:1 !important;
color:black !important;
fill:black !important;
}

Any help on this matter would be greatly appreciated.

Thank you for your assistance, and please excuse my confusion as I try to navigate through this issue.

htmlcsshyperlinkhover

Answer №1

give this a shot

.addtoany_list a:hover img, .addtoany_list a:hover span {
    visibility: visible;
}

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

When I apply a percentage to the height of a div element, it shrinks down to a height

I have several lists with a flex layout. Each column contains 3 list items, and the flex-basis is set to one-third. Within each li element, there is a div for a background image and another div to display text, which should be positioned below the image. ...

htmlcssflexbox

What is the process of transforming a string into an angular binding?

I have a variable called message that contains the text "you are moving to {{output.number}}". I attempted to insert this into a div element using $("#message").html(message); However, it just displayed the entire string without replacing {{output.number ...

javascriptangularjshtml

Adjust the size of the embedded iframe to match the dimensions of the containing div

Is there a method to resize the iframe embed code for a vine so that it fits within the boundaries of the enclosing div? The supplied embed code already includes sizing information as shown below: <iframe src="https://vine.co/v/iMJzrThFhDL/embed/simp ...

javascripthtmlangularjs

Looking for assistance in creating an html page with a rotating CSS div containing unordered lists and list items

I am sharing the HTML content of my test page that I am looking to customize similar to some websites I have come across. My goal is to create a rotating div with an unordered list (ul li), where only three divs are displayed at a time while the rest remai ...

javascripthtmlcss

Is it possible to extract a div from a third-party domain and showcase it on my website?

Trying to integrate content from my Veetle.com channel onto my personal website has proven to be quite the challenge. Initially, I attempted to modify an iframe with CSS to display only the schedule information, but encountered limitations due to using 3rd ...

javascriptcssiframecross-domaindynamic-data

Styling a custom Qt class using a CSS selector

I have developed a custom "Slider" widget as a subclass of QWidget and am looking to customize its appearance using Qt's stylesheets. Is there a way to define this widget to the Qt application so that any styling set in the application stylesheet will ...

cssqtqt4css-selectors

Jquery and CSS3 come together in the immersive 3D exhibit chamber

Recently, I stumbled upon an amazing 3D image gallery example created using jQuery and CSS3. http://tympanus.net/codrops/2013/01/15/3d-image-gallery-room/ Excited by the concept, I attempted to incorporate a zoom effect (triggered every time a user clic ...

javascriptjquerycss

A guide on updating CSS content dynamically within ExtJS

In my resource folder, I have a CSS file that contains some values which I need to change or add based on certain conditions. However, I'm struggling to figure out how to achieve this. Here is an example of the code: triggers: { clear: { ...

javascriptcssextjs

Discover the procedure to alter date formats in MongoDB

I recently created a MongoDB collection using Node.js with the following code: var mongoose = require('mongoose'); var TTTUsersSchema = new mongoose.Schema({ username: String, password:String, active: Boolean, created_at: { type: Dat ...

htmlnode.jsmongodb

"Exploring the process of integrating a controller into an external HTML file using AngularJS

I'm relatively new to AngularJS. In my web app, I have a set of buttons: index.html <button class="aButton">a</button> <button class="bButton">b</button> <script> $(document).ready(function(){ $(".aButton"). ...

javascripthtmlangularjsiframe

SyntaxError: The input on line one ended unexpectedly and was not caught

This issue is commonly associated with messy close parentheses, however, the error is occurring on line 1 of the file! Below is the javascript code from (filename: calculate.js) var colors = new Array(); colors["SILVER"] = -2; ... Although there is m ...

javascripthtmlsyntaxsyntax-error

What is the best way to create a three-column layout that completely fills the width of a page, utilizing pixel measurements on two of the columns

Click here for the jsFiddle link: Is it possible to make div2 and Button2 fill the remaining width of the window while using pixel measurements on columns 1 and 3? This formatting will be applied to a form where a textbox needs to adjust its size based o ...

csshtml

Is it possible to convert a .gif file into a jpeg image format for mobile display on my Gatsby website?

I'm looking to convert a .gif file into a mobile.png image for my Gatsby site, but I'm struggling to find the right resources. Does anyone have suggestions on how I can achieve this? Here is the frame: https://i.sstatic.net/IjYv4.png ...

javascriptcssreactjsgatsby

Div displaying with extra space below

UPDATE check out the new jsfiddle link here that effectively showcases the problem I am encountering an issue with white space appearing below my div. This can be seen in 2 photos, one of which is scrolled down: https://i.sstatic.net/yHlXL.png https:// ...

htmlcsstwitter-bootstrap-4

Why is Google Chrome cutting off parts of my website?

Has anyone encountered the strange rendering issue in Google Chrome? Check out this bug here http://community.mediabrowser.tv/uploads/site_1/126/annoying_rendering_bug.jpg I sometimes experience it when I visit What is causing this issue? Is there a way ...

htmlcssgoogle-chrome

The scroll function is executed only one time

I'm currently working on implementing a sticky sidebar snippet using jQuery. However, I am facing an issue where the function within .scroll() is only executing once instead of on every scroll event. Can anyone help me identify what I might be doing i ...

javascriptjquerycss

Design featuring a fixed top row and a scrollable bottom row

I need to divide a div container into two vertical sections, one occupying 60% of the space and the other 40%. The top div (60%) should always be visible, while the bottom div (40%) should be scrollable if it exceeds its limit. I have tried different app ...

htmlcssjquery-mobile

What is the best way to specify the dimensions of an image with CSS or Bootstrap?

I am facing some challenges while building my website. The ideal look of the page is represented by home_page_ideal. The issue arises with the small boxed image on the top left corner. Once I scroll to the top, the page displays as home_page_issue. The CSS ...

htmlcsstwitter-bootstrap

Having trouble displaying the output on my console using Node.js

Hey there, I'm new to this community and also new to the world of nodejs technology. I have encountered a problem that may seem minor to you but is quite big for me. Here's what's going on: In my code snippet, I want a user to input 3 value ...

javascripthtmlnode.js

Establishing the rotation attribute of an SVG circle to create an angular progress tracker

Exploring the code of an Angular component and came across how the r attribute for an svg circle is defined like this: [attr.r]="radius - stroke / 2" This seems to work, but I'm wondering why it's done this way. Isn't the r attribute suppo ...

htmlangularsvg