Question

有没有办法像父级一样调整子级元素的大小？我想实现这样的目标：

调整大小后，黄色框应停留在标记的位置（红色标记）。

我已经尝试将.imageDiv和.box设为相对我想要的位置（底部100像素；右侧：200像素）。

$custIDs = Get-MicrosoftPartner


$group = 10 # step of 10
$i = 0


do {
     $custIDs[$i..(($i+= $group) - 1)]
     '*****'

     Export-MicrosoftData -CustomerId $custIDs

     }
      until ($i -ge $custIDs.count -1)




function Export-MicrosoftData {
    [CmdletBinding()]
    param (
        # Customer ID from Microsoft Partner Center
        [Parameter(Mandatory=$true,ValueFromPipeline=$true)][string[]]$CustomerId
    )


        $CustomerId.ForEach({
            $Organization = [myClass]::new()
            $Organization.PopulateData($_)
            $ArrayOfOrganizations.Add($Organization)
        })

我的HTML是这样的：

.container{
  width: 100%;
  height: 100%
}

.imageDiv{
  position: relative;
  width: 100%;
  height: 100%;
  background-image: url("linkToMyImage");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.box{
  position: absolute;
  bottom: 100px;
  right: 200px;
  height: 100px;
  width: 100px;
  background: yellow;
}

有趣的是，当我缩小（ctrl +鼠标滚轮）时，它位于正确的位置，但是当我将其缩小时，它不会停留在应有的相同位置。

Answer 1

在.box中使用％-值表示宽度和高度，例如：

.box{
  position: absolute;
  bottom: 100px;
  right: 200px;
  height: 40%;
  width: 50%;
  background: yellow;
}

绝对定位的孩子应该像父母一样调整大小

1 个答案: