引导按钮 - 删除Chrome OS X上的大纲 [英] Bootstrap button - remove outline on Chrome OS X

问题描述

我正在寻找实现：
http://getbootstrap.com/javascript/#popovers-examples - 滚动到现场演示，并在OS X上的Chrome浏览器中点击红色的弹出式按钮....这是完美的美丽

现在去这里问题的孩子）： http://yoyo.io/javascript/#popovers - 它概述了蓝色，aaaargh。

如果你检查一下，你会看到一堆CSS的努力从我这里删除！
在Safari和Firefox中看起来是正确的，但在Chrome浏览器中却不行！

任何人 - 我忽略了什么？

$

解决方案

我看到 .btn：focus code>有一个大纲就可以了：



  .btn ：focus {
 outline：thin dotted; 
 outline：5px auto -webkit-focus-ring-color; 
 outline-offset：-2px; 
 
  

尝试将其更改为：



  .btn：focus {
 outline：none; 
 
 $ / code> 

基本上，查找 outline on ：focus ed元素 - 这就是导致它的原因。

I am looking to achieve this: http://getbootstrap.com/javascript/#popovers-examples - scroll to the "live Demo" and hit the red popover button, in Chrome on OS X.... It's perfect beautiful

Now go here (the problem child): http://yoyo.io/javascript/#popovers - it outlines blue, aaaargh.

If you inspect you will see a litany of CSS efforts from me to remove this! It looks correct in Safari and Firefox but a no go in Chrome!

Anyone - what am I overlooking??

Many thanks in advance!

解决方案

I see .btn:focus has an outline on it:

.btn:focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

Try changing this to:

.btn:focus {
  outline: none;
}

Basically, look for any instances of outline on :focused elements — that's what's causing it.

这篇关于引导按钮 - 删除Chrome OS X上的大纲的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！