Html css最大宽度不起作用

我有父元素

宽度：100px

和

位置：相对。我有它的内部元素，位置是绝对的。我需要这个内部元素延伸到200px，但它不工作。所需的最大值为父级的100%

UPD
我不希望宽度固定。如果有内容，我只需要它达到
200px
，如果没有太多内容，我只需要它达到
auto

p、 我需要那些
位置
属性

以下是html：

<div class='parent'>
    <div>element</div>
    <div class="inner">
        <div class="item">text</div>
        <div class="item">text</div>
        <div class="item">text</div>
        <div class="item">text</div>
        <div class="item">text</div>
        <div class="item">text</div>
        <div class="item">text</div>
        <div class="item">text</div>
        <div class="item">text</div>
    </div>
</div>

以这个例子为例

任何人都可以帮忙
工作正常。允许的最大宽度为200像素。请看这里：


可能您只搜索
宽度
（已修复）

查看它的工作情况：
将“
宽度：200%
”添加到
内部
，而
最大宽度仍将工作

.inner {
    width: 200%;
    max-width: 200px;
    border: 1px solid red;
    position: absolute;
}

如果您使用的是AngularJS，则可以使用
ng style={'width'：'200%}
。如果没有，您可以将其更改为从父级继承`

.inner {
    max-width: inherit;
    border: 1px solid red;
    position: absolute;

}

干杯
 所有这些问题（奇怪的行为）都是由这条线引起的-

.item {
    float: left; /* THIS ONE */
    border: 1px dotted grey;
}

您需要为这些文本块找到一些其他替代方法来对齐。您可以使用
display:table cell
而不是
float
，但这会使块脱离
#内容

如果我找到其他选择，我会更新我的答案。
为家长给出
位置：static
，然后再试一次

.parent {
    border: 1px solid yellow;
    position: static;
    width: 100px;
}

.inner {
    border: 1px solid red;
    max-width: 200px;
    position: absolute;
}

这是预期的行为。未达到
.internal
的
max width
值，因为它受
父项的
width
和
float
ed
的限制。项
s将仅位于同一行，直到它们到达包含元素的右边缘

解决此问题的一种方法是使用伪元素来实现类似的边界结果，而不使用限制性的
宽度
：


从
.parent
中删除
宽度
，这将导致它占据
宽度
的
100%，因为它是
块
级别元素。移除
边框：1px纯黄色因为它将不再具有所需的结果

创建一个新的伪元素
。父元素：在
之前。设置
边框：1px纯黄色和
宽度：100px以显示此页面上的黄色边框

将
.parent:before
设置为
位置：绝对且具有<代码>高度：100%
将其相对定位
.parent
，并使其填充正确的区域

既然
.internal
不受
.parent
的
宽度的限制，它应该遵守
最大宽度：200px规则


.parent{
位置：相对位置；
}
.家长：以前{
边框：1px纯黄色；
内容：“；
显示：块；
身高：100%；
位置：绝对位置；
宽度：100px；
}
.内部{
边框：1px纯红；
最大宽度：200px；
位置：绝对位置；
}
.项目{
边框：1px点灰色；
浮动：左；
}

要素
文本
文本
文本
文本
文本
文本
文本
文本
文本
max width
不是这里的问题–该属性正在工作，因为元素的宽度不会超过200px。问题在于如何计算绝对定位图元的宽度。如果您希望它更宽，则必须指定
宽度
（或同时使用
左
和
右
。@CBroe是的，您是对的。它不会超过200:）我只是需要它更宽，如果有内容的话可以达到200px，如果没有太多内容的话可以自动。但是谢谢你的帮助，在这种情况下，你不能轻易地用CSS获得“高达200px的内容”；首先，你要让你的内容有这样的宽度，而目前它没有，因为它可以在每一个“文本”后打断到一个新的行上。如果你不想发生这种情况，那么你必须用不同的方式来组织和/或格式化你的内容。谢谢你的帮助。我会尝试不同的方法，我不希望宽度是固定的。我只需要它是更广泛的高达200px的，如果有内容和自动，如果没有太多的内容。但是谢谢你的帮助，所以你的代码是有效的。在我创建的这个提琴中，当内容较大时，您可以查看内部设置为200px，如果删除内容，则宽度为autoyes。它适用于textx，但不适用于我的内容（那些块）。对不起，我不明白你的意思。我知道这很好，如果你的内容是图像，也许你需要将样式应用到img。这是我的内容：
text
我不希望宽度固定。我只需要它是更广泛的高达200px的，如果有内容和自动，如果没有太多的内容。但是谢谢你的帮助，我不希望宽度被固定。我只需要它是更广泛的高达200px的，如果有内容和自动，如果没有太多的内容。但是谢谢你的帮助。井
float：左对我来说并不重要。我还尝试了
display:flex
。但是使用
display:table cell
I只能有一行。我需要它变成两行当内容是bigger@Matiishyn
display:table cell
工作正常，但只有一个缺陷，文本块不会换行到下一行。@Matiishyn很抱歉我的评论有一半。实际上，如果您可以添加一个

来将它们打断到下一行（在插入一些块之后插入

），正如我在问题中所写的，我需要像这样设置这些
位置
属性<代码>相对
用于父级。谢谢你的回答
.item {
    float: left; /* THIS ONE */
    border: 1px dotted grey;
}

.parent {
    border: 1px solid yellow;
    position: static;
    width: 100px;
}

.inner {
    border: 1px solid red;
    max-width: 200px;
    position: absolute;
}