Question

我试图绝对将侧面文本放在div中，因为有多个出现。

每个孩子的位置：绝对; ，每个父母都有职位：亲属;

    .parent{
    width: 24%;
    display: inline-block;
    float: left;
    border-left: 1px solid #FFA500;
    position: relative;
    }

    .child{
    display: inline-block;
    line-height: 1.5;
    height: 5%;
    position: absolute;
    top: 0px;
    right: 0px;
    transform: translate(0px, 100%) rotate(90deg);
    overflow: hidden;
    float: right;
}

其中一些孩子去了页面上的同一个地方，这似乎是第一个孩子的父母。结构是

Parent
    child
close
close

所有4个div。

有人可以帮忙吗？

Answer 1

在你的css中，如果你的父母没有绝对位置子div之外的内容，那么父亲有一个0高度声明 - 所以你必须设置父div的高度（以像素为单位）才能给它一个位置在DOM中。

Answer 2

你的身高：.child上的5％可能就是把它扔掉（这对我而言）。那，或者可能有其他的css覆盖了你的东西。在这里小提琴：https://jsfiddle.net/tagb3yja/

.parent{
  width: 24%;
  display: inline-block;
  float: left;
  border-left: 1px solid #FFA500;
  position: relative;
  background: yellow;
}

.child{
  position: absolute;
  display: inline-block;
  line-height: 1.5;
  top: 0px;
  right: 0px;
  transform: translate(0px, 100%) rotate(90deg);
  overflow: hidden;
  float: right;
  background: silver;
}

CSS绝对定位不会移动到父级，父级是相对的

2 个答案: