Question

我在HTML的div＃A中有一个div＃B。 div＃A在CSS文件中有填充，我希望不影响div＃B；我尝试了这个↓，但是由于它们具有百分比格式，所以它不起作用（由于百分比原因，它不能完全适合父div）！

public static String normalizeURL(String oldLink)
{
    int pos=oldLink.indexOf("://");
    String newLink="http"+oldLink.substring(pos);
    return newLink;
}

div#wrapper {
  width: 80%;
  margin: 5px auto;
  background: blue;
}
#sidebar {
  float: left;
  width: 19%;
  margin-right: 1%;
  background: green;
  border-radius: 5px;
}
#A {
  padding: 0.5% 2%;
  width: 76%;
  background: red;
  float: right;
  margin-bottom: 5px;
}
#B {
  border-radius: 5px 5px 0 0;
  height: 116px;
  background: green;
}

Answer 1

它工作正常，对css进行了一些小的更新，请查看以下工作片段：）

#A {
  padding: 1%;
  background: red;
}
#B {
  margin: -1%;
  background: green;
}

<div id="A">
  <div id="B">&nbsp;</div>
</div>

根据更新的要求，您可以在项目中更新position的{{1}}和height，如果可以，则下面的代码段将对您有用

#A

div#wrapper {
  width: 80%;
  margin: 5px auto;
  background: blue;
}

#A {
  padding: 0.5% 2%;
  width: 76%;
  background: red;
  margin-bottom: 5px;
  position: relative;
  height: 116px;
}

#B {
  background: green;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  left: 0;
}

Answer 2

如果在B上添加填充，它将解决您的问题。

#B{
padding: 20%;}

像那个例子。

Answer 3

#B {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
}

这里的想法是使用left: 50%;将容器推到浏览器窗口的正中间，然后以负的margin-left: -50vw;将容器拉回到左侧。

删除子div的父填充

3 个答案: