代码之家  ›  专栏  ›  技术社区  ›  Mala

为什么“padding”有时在元素宽度内计算,有时不计算?

  •  0
  • Mala  · 技术社区  · 14 年前

    input.clientWidth = input.style.width
    

    在其他页面上,输入宽度 包括填充:

    input.clientWidth = input.style.width + input.style.paddingLeft + input.style.paddingRight
    

    因此,下面是一个小代码段:

    input.style.width = '300px';
    input.style.border = '1px solid grey';
    input.style.padding = '20px';
    alert(input.clientWidth);
    

    在某些页面上,此警报为298(300-1px边框),在其他页面上,此警报为338(300-1px边框+20+20)。是什么原因造成的?更重要的是,我能做些什么来获得一致的行为?

    编辑:

    这都是在同一个浏览器-火狐3.6.8

    2 回复  |  直到 14 年前
        1
  •  3
  •   meder omuraliev    14 年前

    对于IE来说,可能是某些页面处于怪癖模式,而box模式不是使用的标准模式。

    这个 document.compatMode 会是 CSS1Compat BackCompat 对于怪癖模式。你可以根据这一点来计算。

        2
  •  0
  •   Justin Force jmbucknall    14 年前

    为了保持一致的行为,可以将填充、边距和边框考虑到每个宽度中,即(伪代码)

    totalWidth = input.width + input.padding + input.margin + input.border;

    显然,你必须做一些字符串操作来挑选那里的整数,然后把它们相加。