设置可点击图标背景的大小

Question

我正在寻找一种方法来设置关闭图标的可按下区域。因此，如果图标为19X19，则要按下的区域将为39X39。div是clost botton的容器，我想更改它。我不想设定一个固定的高度，因为它有时很窄，另一方面，父亲根本没有高度，他的父亲。。。

<div class="ui-pnotify-closer" style="cursor: pointer; visibility: visible;">
    <span class="glyphicon glyphicon-remove" title="Close"></span>
</div>

所以我想做这样的事情：

.ui-pnotify-closer{
  margin: -10px -10px -10px 10px ;
  padding: 10px 10px 10px 10px;
  height: 40px;
}

但这并不优雅。还有其他想法吗？

Answer 1

我想你看起来像下面这样。

HTML

 <div class="test">
  <span><img src="test.gif" width="19" height="19" border="0" /></span>
 </div>

CSS

 .test
 {
  background-color:#ff00ff;
  padding:10px;
  cursor:pointer;
  display:inline;
 }

Fiddle演示