Html CSS边框半径有问题

我正在为父div.outertContainer将以下代码添加到CSS文件中，但边框半径只影响顶部的两个角，而不影响底部的两个角。我似乎想不出来。其他一切似乎都很好

   *{
  background-color: white;
  margin: 0;
  padding: 0;
}

.outerContainer{
  position: absolute;
  border-radius: 9px;
  top:23%;
  right: 10%;
  width:30%;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 4px 14px 0 rgba(0, 0, 0, 0.17);
}

.input-form-control{
  margin-top: 20px;
  margin-left: 16px;
  width: 80%;
  padding: 16px 24px;
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: white;
  line-height: 10px;
  font-size: 16px;
}
::placeholder {
  color: #99a3a4;
}
.submit-btn{
  margin-top: 18px;
  margin-left: 17px;
  margin-bottom: 65px;
  border-radius: 4px;
  border: none;
  color: white;
  padding: 13px 20px;
  width: 92%;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  
}

以下是html代码：

<div className="LoginPage">
     
        <div className="outerContainer">
                <form name="form">
                    <div className="emailLabelInput">
                        <input type="text" className="login-form-control" name="email" placeholder="Email address"/>
                    </div>
                    <div className="passwordLabelInput">
                        <input type="password" className="login-form-control" name="password" placeholder="Password"/>
                    </div>
                    <div className="form-group">
                        <button className="submit-btn">Log in</button>

                    </div>
                </form>
            </div>
          </div>

登录

你的问题是你的

*{background:white；}

使得所有元素的背景都是白色的。由于

表单

与

外部容器

一样大，并且没有

边界半径

，因此它有效地覆盖了应用于

外部容器的
边界半径
。因此，您有两种解决问题的方法：

1-删除
*{background:white；}
。除了两个输入仍然位于
outerContainer
的左上角之外，这在大多数情况下都有效，当然，这两个输入仍然覆盖了该角。如果你把这些放在不同的位置，这就行了

2-向
外部容器添加
填充：10px
。这将给
外部容器
一点“呼吸空间”，并防止
表单
覆盖角落。请参阅下面的代码片段


*{
背景：白色；
保证金：0；
填充：0；
}
.登录页面{
高度：100vh；
宽度：100vw；
}
.外部容器{
填充：10px；/*添加到显示半径*/
位置：绝对位置；
边界半径：9px；
最高：23%；
右：10%；
宽度：30%；
盒影：0 4px 8px 0 rgba（0,0,0,0.1），0 4px 14px 0 rgba（0,0,0,0.17）；
}
.输入表单控件{
边缘顶部：20px；
左边距：16像素；
宽度：80%；
填充：16px 24px；
边框：1px实心#ccc；
边界半径：4px；
背景色：白色；
线高：10px；
字体大小：16px；
}
：：占位符{
颜色：#99a3a4；
}
#错误消息{
边框：1px实心#ff7f50；
边缘顶部：10px；
左边距：16像素；
宽度：80%；
填充：16px 24px；
边界半径：4px；
线高：正常；
字体大小：15px；
}
.提交btn{
边缘顶部：18px；
左边距：17px；
边缘底部：65px；
边界半径：4px；
边界：无；
颜色：白色；
填充：13px 20px；
宽度：92%；
文本对齐：居中；
文字装饰：无；
显示：内联块；
}

登录
你能为父母及其子女发布html和css吗？我添加了完整的css代码我们仍然需要html来解决很多问题。凯，我也添加了html是的，就是这样。通过添加10px，它起作用了。我认为这个答案是正确的。非常感谢你。