gpt4 book ai didi

html - flexbox 没有采用正确的宽度 Angular

转载 作者:行者123 更新时间:2023-11-28 01:49:47 25 4
gpt4 key购买 nike

我创建了一个 flex 表格,它没有向我显示正确的表格,只有第一个表格很好,其他表格的宽度不一样。我试图将类(class)计划中的另一个 div 放入,但没有在行中显示我。

您可以在下方找到代码。 Here is the photo what looks like for the moment

<div class="planning-videx">
<div class="name-block" *ngFor="let valueItem of showVI()">
{{valueItem.name}}
<div class="planned">
{{actualCosts | moneyFormat}}
</div>
<div class="planned">
{{plannedCosts | moneyFormat}}
</div>
</div>
</div>

这是CSS

$row-background-color: white;
$row-height: 100%;
$content-height: 45px;
.planning-videx {
@extend .vp-column;
margin-left: 10px;
overflow: auto;
max-height: $row-height;
.name-block {
@extend %common-block;
@include center(false, true);
@include justify-content(space-between);
height: 40px;
margin-left: 1px;
padding-left: 10px;
div.planned {
@extend %flexbox;
@include center(false, true);
border-left: solid thin $border-color;
padding: 0 5px;
width: 150px;
height: 100%;
}

}
.costs-block {
@extend %common-block;
@include center();
@include justify-content(flex-end);
margin-left: 10px;
padding-right: 5px;
width: 100px;
flex-direction: row;
}
}

%common-block {
@extend .vp-row;
background-color: $row-background-color;
margin-top: 1px;
margin-bottom: 1px;
min-height: $content-height;
border: solid thin $border-color;
border-radius: 3px;
}

最佳答案

我会为 money 类别设置一个 flex basis 或一个 set width,然后为标题设置一个“flex: 1”,以便它可以增长到剩余空间。

关于html - flexbox 没有采用正确的宽度 Angular,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50011163/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com