Question

我正在尝试为IE8中的某些元素添加角落，这是CSS3无法做到的。我采用的方法是使用jQuery.corner库并使用div包装我的元素，然后使用jQuery.corner对该div进行舍入。我发现我需要调整包装div的宽度，否则我会得到一个类似子弹的按钮，左侧只有圆角。我有类似下面的代码，它在一些放大倍率下工作正常，但在较低或较高放大倍数下右侧显示额外的条形。也就是说，有时div确实按照我想要的方式包含元素的宽度，但有时它需要一些小于那个数字。我该怎么做才能改进代码？注意10是我要包装的元素的左右填充。

jQuery(document).ready(function() {

        jQuery(".tranCoreButton").each(function(index) {
        var className = 'allRoundCorners' + index;
        var buttonWidth = jQuery(this).width() + 10;
        jQuery(this).wrap("<div class=" + className + "></div>");
        jQuery("." + className).width(buttonWidth);
        jQuery("." + className).corner("round 10px");
        jQuery("." + className).css("display", "inline-block");
    });
});

Answer 1

您是否尝试在CSS中使用 sane 框模型？也许这有助于边框和填充问题......

.tranCoreButton {
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
    box-sizing: border-box;
}

jQuery获取元素的宽度

1 个答案: