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.
Related
Hover over the currency signs (which clicked, change the pricing currency) and a text icon "I" shows instead of the mouse. How do I fix this?
Explanatory screen shot can be found at: here
The page itself is found: here
Posting image as code as not enough rep to post images, if someone could edit that would be appreciated.
Insert this code somewhere in your css files,
#currency-switch > span {cursor:pointer}
Add "cursor:pointer" in css rules:
#currency-switch span {
cursor: pointer;
margin-left: 10px;
}
cursor:pointer in css rules:
#currency-switch span {cursor: pointer;margin-left: 10px;}
See also
You need to change your cursor on hover for specific elements. There are a lot of cursor types for me to paste them all here, so take a look ---> http://www.w3schools.com/cssref/pr_class_cursor.asp
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;
}
My problem is remove dotted border when I click on a tag link. After clicking its looks like following type.
I also tested in jsfiddle but on there this work perfect not unwanted dotted border draw when I enter image description here click on a tag link.
In old browser versions, css properties inherit from parent properties.
Almost all old browser versions have this problem.
To fix this, add outline properties in your <a> tag and set value 0 none:
a {
outline: 0 none;
}
.classname a{ outline:none;}
or
a{ outline:none;}
So, whenever I click on my button, this happens:
Is there any way to prevent this?
Thanks guys. :)
Answered already (probably many times, but here's one example): https://stackoverflow.com/a/3397158/839847
Quoted here for convenience:
This border is used to show that the element is focused (i.e. you can
type in the input or press the button with Enter). You can remove it,
though:
textarea:focus, input:focus{
outline: 0;
}
You may want to add some other way for users to know what element has
keyboard focus though for usability.
Chrome will also apply highlighting to other elements such as DIV's
used as modals. To prevent the highlight on those and all other
elements as well, you can do:
*:focus {
outline: 0;
}
Think you keeping your button inside <a> tag. If so use this code
a #btnid
{
border:none;
}
panelMain.setBackground(Color.WHITE);
Button.setBackground(Color.WHITE);
Adding this to your JFrame inherited class constructor will resolve the issue. The color does not have to be white, you can set it anything, just make sure the panel and button are of the same color. and please don't trust my answer too much because I too am a beginner
To make this work for me in Chrome in 2021 I added this to my Site.css file:
.btn,
.btn:focus,
.btn:active,
.btn:hover {
border: 0 !important;
outline: 0 !important;
}
I am developing a website and everywhere i have this annoying problem... I wonder how other sites dont have this problem... any suggestion?
stackoverflow has this problem as i see...
http://inath.gr/ this site for example at the top menu although it has <a> tags there is no rectangle arround it when selected somehow..
CSS outline property:
You can turn it off with:
<style type = "text/css">
a {outline:0;} /*this is that dotted line you get when you select an image, I believe you're talking about the outline*/
a img {border:0;} /*Images in links default to having a blue border, so this could be the source of another annoying rectangle*/
</style>
The following is considered better because it allows users to still navigate by keyboard.
Here is a link explaining why:
http://people.opera.com/patrickl/experiments/keyboard/test
a:hover, a:active { outline: none; }