CSS：无法将顶级房产超过100％

Question

我无法将顶级属性设置为超过100％。下面是我的CSS代码：

请参阅规则集Person.findOne({ firstName: 'John', lastName: 'Smith' }) .then(filterDocument) 。 top属性必须超过100％才能对齐元素。

＆＃13;

＆＃13;

.blue3

＆＃13;

.container {
  display: flex;
  justify-content: center;
}

.circle {
  margin-top: 50px;
  display: inline-block;
  position: relative;
  float: left;
}

.wrapper {
  overflow: hidden;
  border-radius: 50%;
}

.green, .green:before, .green:after, .blue, .blue:before, .blue:after, .blue1, .blue1:before, .blue1:after, .blue2, .blue2:before, .blue2:after, .blue3:before, .blue3:after {
  width: 100px;
  height: 100px;
  border-radius: 50%;
}

.green, .blue, .blue1, .blue2, .blue3{
  position: relative;
  opacity: .5;
}

.green:before, .blue:before, .blue1:before, .blue2:before, .blue3:before {
  top: -50%;
}

.green:after, .blue:after, .blue1:after, .blue2:after, .blue3:after {
  bottom: -50%;
}

.green {
  background-color: rgb(10,210,30);
}

.green:before, .green:after {
  content: '';
  background-color: #fff;
  position: absolute;
  left: -50%;
}

.blue {
  position: absolute;
  background-color: rgb(0,20,210);
  left: 50%;
  top: 17%;
}
.blue1 {
  position: absolute;
  background-color: rgb(0,20,210);
  left: 50%;
  top: 50%;
}

.blue2 {
  position: absolute;
  background-color: rgb(0,20,210);
  left: 50%;
  top: 83%;
}

.blue3 {
  position: absolute;
  background-color: rgb(0,20,210);
  left: 50%;
  bottom: 200%;
}


.blue:before, .blue:after, .blue1:after, .blue1:before, .blue2:before, .blue2:after, .blue3:before, .blue3:after {
  content: '';
  background-color: #fff;
  position: absolute;
  right: -50%;
}

＆＃13;

＆＃13;

＆＃13;

Answer 1

.green, .green:before, .green:after, .blue, .blue:before, .blue:after, .blue1, .blue1:before, .blue1:after, .blue2, .blue2:before, .blue2:after, .blue3, .blue3:before, .blue3:after {
  width: 100px;
  height: 100px;
  border-radius: 50%;
}

我猜cb

中缺少.blue3