如何防止padding属性更改CSS中的宽度或高度? [英] How do I prevent the padding property from changing width or height in CSS?

查看:127
本文介绍了如何防止padding属性更改CSS中的宽度或高度?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用 DIV 创建了一个网站。一切正常,除非我创建一个DIV。我创建他们像这样(示例):

I am creating a site with DIVs. Everything's working out except when I create a DIV. I create them like this (example):

newdiv {
    width: 200px;
    height: 60px;
    padding-left: 20px;
    text-align: left;
}

当我添加 padding-left 属性, DIV 的宽度更改为220px,我希望它保持在200px。

When I add the padding-left property, the width of the DIV changes to 220px, and I want it to remain at 200px.

假设我创建了另一个 DIV 命名为 anotherdiv newdiv ,并将其放在 newdiv 里面,但 newdiv 没有填充和 anotherdiv padding-left:20px 。我得到相同的东西, newdiv 的宽度将是220px。

Let's say I create another DIV named anotherdiv exactly the same as newdiv, and put it inside of newdiv but newdiv has no padding and anotherdiv has padding-left: 20px. I get the same thing, newdiv's width will be 220px.

如何解决这个问题? / p>

How can I fix this problem?

推荐答案

添加属性:

-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */

但请注意, strong>在Internet Explorer 8以下版本。

But note this won't work in Internet Explorer below version 8.

这篇关于如何防止padding属性更改CSS中的宽度或高度?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆