safari a:visited border color automatically on div?

I have a div wrapped in a <a> tag like this...

<a href='/'><span>Quiz</span>

and then my css stylesheet looks like this...

a:visited {
    color: green;
}

But when the link is visited, it looks like this...

I have tried defining the border settings in the a css selector in various ways with no luck. Any ideas on how to fix this?

Answers


This is not an outline, probably there is already a border on, either your span or your a. Now, if the border doesn't have a specific color set, e.g.

border: 1px solid;

instead of

border: 1px solid black;

then it's color is defined by the color property. Which means that what is happening is normal.

Now, you have two options, either you find where is this border defined and remove it or add a color to it. Or you override it in some way like:

a:visited {
  color: green;
  border-color:transparent;
}

you may need !important on the border-color rule but that depends.


Use outline instead of border to fix this.

Thanks


i think it will be better if you look into the style section of the safari inspection. There are certain browser default styles which behave in a similar way. If you find any outline or border declaration, try to neutralize that declaration by declaring from your end border: 0; outline: none;

It will be of real help if you could share with us the code over fiddle or codepen.

Note: I was unable to recreate the scenario as you specified.


Need Your Help

Why does alloc not work in applicationWillEnterForeground?

ios objective-c iphone cocoa-touch

I both put this in applicationDidFinishLaunchingWithOptions and applicationWillEnterForeground in AppDelegate.m:

Delete relationship and object from context in NSManagedObject deinit

ios swift core-data nsmanagedobject

I have a NSManagedObject with a to many relationship looking like this: