YogeshChauhan.com
How to remove border from :visited image, link or button?
August 3, 2020


Many times we want an object in the place of an link or a button and when we click on it, it leave an a border kind of line — an outline. Well, unless you click somewhere on the screen, it won't go away. To remove that, we can use outline property of CSS. 

CSS Outline Property

An outline is a line that is drawn around elements, OUTSIDE the borders, to make the element "stand out".

Borders and outlines are very similar. However, outlines differ from borders in the following ways:

1. Outlines never take up space, as they are drawn outside of an element's content.
2. According to the spec, outlines don't have to be rectangular, although they usually are.

CSS has the following outline properties:

1. outline-style
2. outline-color
3. outline-width
4. outline-offset
5. outline

CSS Outline Style

The outline-style property specifies the style of the outline, and can have one of the following values:

1. dotted – Defines a dotted outline
2. dashed – Defines a dashed outline
3. solid – Defines a solid outline
4. double – Defines a double outline
5. groove – Defines a 3D grooved outline
6. ridge – Defines a 3D ridged outline
7. inset – Defines a 3D inset outline
8. outset – Defines a 3D outset outline
9. none – Defines no outline
10. hidden – Defines a hidden outline

✅ So, we can use the outline:none, to remove the outline.

NOTE

For links, we can use border and outline both properties as null to solve the problem.

Credit: MDN Docs

dreamhost

Leave a Reply

Most Read

#1 How to check if radio button is checked or not using JavaScript? #2 How to set opacity or transparency using CSS? #3 Pagination in CSS with multiple examples #4 How to make HTML form interactive and using CSS? #5 How to uninstall Cocoapods from the Mac OS? #6 Solution to “TypeError: ‘x’ is not iterable” in Angular 9



Recently Posted

Feb 25 How to set default timezone using PHP? Feb 24 WordPress: How to loop through a repeater field in ACF? Feb 24 How to get ACF values from custom post type? Feb 24 WordPress get_posts Examples Feb 24 How to modify the latest post array using get_posts() in WordPress? Feb 22 WordPress: How to get ACF field values from another post?



You might also like these

Select statement in Postgres with examplesPostgresAngular: Templates, directives, data binding, Services and dependency injectionAngulartransform-origin Property in CSSCSSFile System Integrity: How to Keep an Eye on Your Files and Folder Change?MiscRelative Length Units in CSSCSSReverse a String in JavaScriptJavaScript