jQuery UI可调整大小的扩展div

我有一个div，它被设置为使用jqueryui可调整大小。除了轮廓和边框之间有不需要的空间外，所有这些都可以正常工作，因为可调整大小的div正在扩展.test div。到目前为止，我一直在使用overflow:hidden来解决这个问题。这已经很好地解决了，但是，我现在有一个例子，我使用了一个样式：after，它被切断了。我该怎么解决这个问题

这似乎是Firefox中的一个问题

CSS:

---

这是一个

如果我理解正确，您指的是文本上方和下方的额外空间？ 因为您在html中使用了p标记，所以大多数浏览器在每个段落之前和之后都会添加默认的填充/边距。要更改间距，只需添加另一个css类：

.test p{
margin:0px;
}

---

它的目标是段落标记内的任何文本，该标记位于类“test”标识的内容内。请注意，它将所有边距更改为0px，如果您希望在不同的边上显示特定的量，可以使用左边距、右边距、顶部边距、底部边距，或者使用速记。

请在可调整大小的函数之后将这些行添加到jquery中

$("div.ui-resizable-n").css('top','0px');
$("div.ui-resizable-e").css('right','0px');
$("div.ui-resizable-s").css('bottom','0px');
$("div.ui-resizable-w").css('left','0px');

让它变成

$(document).ready(function(){
    $(".test").resizable({
        handles: "n, e, s, w"
    });

    $("div.ui-resizable-n").css('top','0px');
    $("div.ui-resizable-e").css('right','0px');
    $("div.ui-resizable-s").css('bottom','0px');
    $("div.ui-resizable-w").css('left','0px');
});

---

这似乎是Firefox多年来一直存在的一个bug。虽然outline offset是一个选项，但它只需要应用于Firefox，并且需要考虑溢出的所有因素。更好的选择是这样做：

.test {
    border: 1px solid #000;
}

.test:before {
   content: '';
   position: absolute;
   top: -1px; /* Set to offset top border width */
   left: -1px; /* Set to offset left border width */
   right: -1px; /* Set to offset right border width */
   bottom: -1px;/* Set to offset bottom border width */
   outline: 1px dashed #9a9a9a;
}

---

您所说的“css大纲有多余的填充”是什么意思<代码>大纲是一个属性，而不是元素，它不能有

填充

。另外，

：：在最新版本的chrome中，

之后对我来说非常好。。。你能发布这个问题的截图吗？我的2美分：-只需再添加一个容器，使孩子可以调整大小。JQuery附加的div似乎添加了您想要删除的填充…可调整大小的部分需要在div上。我的意思是，在大纲和边框之间有不需要的空间。这不是我想要的。我指的是边界外的空间，轮廓内的空间。嗯，我不确定你在说什么。在我的浏览器中，虚线和轮廓是相互接触的，两者之间没有空格them@KirstenVogler是对的，在chrome中轮廓和边框之间没有空格，但在firefox中它显示轮廓和边框之间的空格。你的右ZAZ、IE和chrome都很好，firefox就是罪魁祸首。关于Firefox的修复方法有什么想法吗？@FanFanFavorite我在Firefox中查看了一下，你可以在CSS中添加一个额外的行，称为outline offset，并给它一个-5px值，这将改变outline的显示位置。您将需要添加一些内容，以便仅在使用firefox时才会更改。我注意到的问题是，底部的三角形迫使轮廓更进一步。你可能想考虑把它变成一个单独的div来避免底部的间隔。我已经投票赞成，因为这是一个选项，但是仍然不能处理：与其他浏览器一样。在Firefox修复浏览器中的错误之前，我上面的解决方案似乎是最好的方法。在我看来，它工作得很好，但是我推荐@FanFanFavorite答案，因为它不涉及任何jquery:-）

.test {
    border: 1px solid #000;
}

.test:before {
   content: '';
   position: absolute;
   top: -1px; /* Set to offset top border width */
   left: -1px; /* Set to offset left border width */
   right: -1px; /* Set to offset right border width */
   bottom: -1px;/* Set to offset bottom border width */
   outline: 1px dashed #9a9a9a;
}