Hyperlink colour changes when click is held - html

I have some hyperlinked text.
However, if I click it (but don't let go of the mouse or pull the mouse away) it disappears. Almost as if there is something other than a:link & a:visited that needs to be styled and the text is turning white (I have a white background).
Does anybody know which tag I need to style to change the colour of the state of the class when the mouse is held on the link? I've tried every <a> tag I can find and nothing is preventing the change of colour. I'm baffled as I've never come across this before.
Thanks in advance.

hope it helps
a:active{
color:#000000 !important; /*or set the color of your choice*/
}

You can try this hope this will help you.
.a:hover,.a:active {
color:black;
}

Related

custom CSS - stuck, i've tried all sorts of combinations

I know this must be simple, but I am just absolutely stuck! I want to change the below to www.readyprint.biz:
When you hover a button (e.g. products) it’s purple/lavender – i want to change it to blue
I want to change the social icon colours – at moment it’s purple/lavender, i want to change it to white
I've tried:
.color-linen #menu-primary li.current-menu-item>a:hover{
background: #42b1fe;
}
But that doesnt work.... same logic I applied to the social icons. I right click the icons in browser, click inspect, and try and figure it out on the CSS section.
please help!
This is a wordpress site by the way, and I'm using a CSS plugin to handle the CSS.
Thanks all!
I think u have already fixed the issue didn't u?
When I visit readyprint.biz the menu item is blue when I hover the mouse.
Maybe u should refresh your webpage.
Edit:
To change the icon to white.
Go to the code:
color-linen #footer a:focus {
color: #565656;
}
Change the #565656 to #000000

Css mouseover not appearing

Hi I have a div with a link however when you hover over the div the mouseover state doesn't change i.e. the mouse pointer doesn't change to a finger instead of a mouse
Unfortunately I am unable to replicate this error in jsfiddle it only seems t occur on my Wordpress installation
the address where it occurs is here http://stylrs.com/trustees/ (when you hover over individual names.)
Is there a reason for this?
How can I fix this?
Add this to your css:
.su-lightbox{ cursor: pointer }
Those blocks arn't links at all. I see though you have a click event tied to them. Just give the block a cursor:pointer css style and it will look like a link
try changing with css :
.linkclass:hover {
cursor:pointer;
}
and please edit your question and give us your code. So, we can see the real problem.
you can change it manualy like this :
.your div {
cursor:pointer;
}

Anchor tags don't work and stay selected until I click again

I'm creating some sort of dashboard which gives the different statuses for data. If you click a status only the objects with that status should be shown. Right now I still have
*TEXT*
for all the anchors. But when I click them my URL doesn't change and when I move my cursor to a different location the text is still underlined.
The first underlined rule in the image is a hover, the last one is the one I clicked before. Now only after I click somewhere else, even empty parts on the website, the underlining goes away.
Does anyone know why this occurs and how I can fix it?
Thanks in advance.
JSFIDDLE: http://jsfiddle.net/xcjufs6e/
I was able to solve it by adding these lines in the CSS
.conexio-info-message a:focus {
text-decoration: none;
}
.conexio-info-message a:focus:hover {
text-decoration: underline;
}

Blue line appearing after second click on image

I don't really know how to write this because i have never seen a problem like this before.
If you go on this website (http://multicopterphoto.no/bolig/) Then click the image of the house. The image preview will appear. Go out of the preview. Now when you hover over the house again you will see a blue line around the circle.
I thought first it was something with the anchor tags, like text-decoration or something but it isn't.
Can you please help me fix this?
simply you must set style to the + element
a .expand .ashit{
outline: 0;
}
More info at Remove Dotted Link Borders
Here's the code:
.expand.ashit{
outline: 0;
}
Just add it to your css styles. That's it.
It's because outline appearing on :focus
ADD .overlay > a:focus {outline-style: none;} to your CSS, This will solve your problem.

onclick button border color change

Should be fairly simple but I'm lost and all searches result in non-specific answers that don't directly relate to my issue.
Button, border is black but apparently, the "depressed" feel is achieved by changing the border color to black so when I do click the button, it feels "dead". Nothing happens, so it's hard to tell if you miss-clicked or what.
How do you change the "onclick" border color? That way, it can get that "depressed" look again.
.addButton {
border-color:black;
border-width:1px;
background-color:#00B0F0;
text-decoration:underline;
}
The best solution is to use css, try the following code:
.addButton:active,
.addButton:focus
{
border:0.5em solid #00c; /* here configure as your needs */
color:#00c;
}
Hope that helps!