当前位置: 首页 > 面试题库 >

如何制作元素宽度:100%减去填充?

金瑞
2023-03-14
问题内容

我有一个html输入。

输入有padding: 5px 10px;我希望它是父div宽度的100%(可变)。

但是,使用width: 100%;导致输入100% + 20px如何解决呢?


问题答案:
.content {
width: 100%;
box-sizing: border-box;
}

-webkit-box-sizing现代浏览器不需要浏览器前缀版本(,等)。



 类似资料:
  • 在鼠标悬停时,我想变换两个相邻的flex元素的位置,如下图所示 标记如下 我希望两个元素都是父元素的100%宽度,第二个元素溢出,这样我就可以在鼠标悬停时变换X。我遇到的问题是两个元素都被挤压到容器中。 我知道我可以在另一个div中包装这两个元素,并给它200%的容器宽度。但想知道这能不能用Flexbox完成

  • 问题内容: 我有一个包装器div,其中两个容器彼此相邻。在此容器上方,我有一个包含我的标头的div。包装div必须为100%减去标题的高度。标头约为60像素。这是固定的。所以我的问题是:如何将包装div的高度设置为100%减去60像素? 问题答案: 这是一个正常工作的CSS,已在Firefox / IE7 / Safari / Chrome / Opera下进行了测试。 w3c尚未批准“ over

  • 问题内容: 当我有一个with时,它并不是100%: 现在,当您调整窗口大小时,会有一个水平滚动条,然后向右滚动,则背景消失了。在这种情况下如何保持背景? 现在,当您调整窗口大小并向右滚动时,您将不再看到背景。如何解决这个问题? 问题答案: 100%值是父级宽度或视口的100%。请参阅文档。

  • 问题内容: +--------------------+ | | | | | | | | | 1 | | | | | | | | | +--------------------+ | | | | | | | | | 2 | | | | | | | | | +--------------------+ 如上所示的(1)的内容是未知的,因为它在动态生成的页面中可能会增加或减少。如上所示,第二个div(

  • 问题内容: 如何为宽度创建CSS规则 默认使用100%宽度 如果100%的宽度超过了某个像素的宽度(例如512像素),则该宽度将被限制为该像素的宽度 我不确定宽度和最大宽度关系,也不知道如何支持calc()或可以表达这一点。这需要与最新的WebKit浏览器和Firefox 4配合使用。不需要IE8等支持。 问题答案: 这实际上是的预期用途。如果元素的计算值(实际值)超过,它将被限制为最大值,而不是

  • 我是使用火花和蟒蛇的新手 我有以下元组 我要做的是,从每个元素中减去,例如(4.32,32.32,23.3),每个帐户对应的平均值,到4.32-3.23,到32.32-32.32。。。 我的想法是做到以下几点。 但是我不知道如何才能正确地输入索引。 我的输入文件具有以下结构。 然后我计算每行的平均值,因此例如对于所有名为Serge的Keys,我有以下数据元组。 现在我想要的是减去每个元素的平均值.