Closed
Bug 613426
Opened 14 years ago
Closed 12 years ago
css3 flexbox request: dynamically obtain min-width|height from other element's dimensions
Categories
(Core :: CSS Parsing and Computation, enhancement)
Core
CSS Parsing and Computation
Tracking
()
RESOLVED
DUPLICATE
of bug 763689
People
(Reporter: giorgio.liscio, Unassigned)
Details
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:2.0b8pre) Gecko/20101117 Firefox/4.0b8pre
Build Identifier:
hi, it would be nice, when flexbox will be a standard and will be improved, to dynamically specify element min-width|height according to other element's dimensions
for example, i want a flexible button with min width/height equal to the contained icon:
<style>
button
{
box-flex:1; /* the button is flexible */
box-orient: horizontal;
min-width: element(::scope > img.icon); /*selector, 16px computed as specified in img' style attribute */
min-height: element(::scope > img.icon); /*selector, 32px computed as specified in img' style attribute */
}
button > span
{
min-width:0;
text-overflow:ellipsis;
}
</style>
<button>
<img class="icon" src="icon.png" style="width:16px;height:32px;" />
<span>My label</span>
</button>
i hope this is a good proposal
(ps i dont know how the scope is resolved by the selector api, i used ::scope to refer to the button itself)
thank you :)
Reproducible: Always
Summary: css3 flexbox request → css3 flexbox request: dinamically obtain min-width|height from other element's dimensions
Comment 1•14 years ago
|
||
Doesn't that just give you an excellent way to produce circular dependencies?
Updated•14 years ago
|
Summary: css3 flexbox request: dinamically obtain min-width|height from other element's dimensions → css3 flexbox request: dynamically obtain min-width|height from other element's dimensions
Comment 3•14 years ago
|
||
Yes, but the sizes of the descendants depend on the ancestor.
Now in flexbox it may be possible to make this converge eventually... maybe.
> Yes, but the sizes of the descendants depend on the ancestor.
not their min-width|height
if my descendant is flexible and/or has align="stretch", its min sizes are not dependent by the ancestor
<style>
button
{
box-flex:1; /* the button is flexible */
box-orient: horizontal;
min-width: element(::scope > img.icon);
min-height: element(::scope > img.icon);
}
button > span
{
min-width:0;
text-overflow:ellipsis;
}
</style>
<button flex="1" align="stretch">
<img class="icon" flex="1" src="icon.png" style="min-width:16px;min-height:32px;" />
<span flex="1">My label</span>
</button>
Comment 5•14 years ago
|
||
Min sizes can be set in percentage units in CSS, no?
ah, true... but percentage are not allowed in flexbox or i'm wrong?
i don't know how it must work, but i think it is useful
so how it is calculated moz-min-content with percentages?
Comment 7•14 years ago
|
||
> so how it is calculated moz-min-content with percentages?
For min-content, percentages are assumed to be 0.
Comment 9•12 years ago
|
||
(In reply to Giorgio from comment #0)
> hi, it would be nice, when flexbox will be a standard and will be improved,
> to dynamically specify element min-width|height according to other element's
> dimensions
>
> for example, i want a flexible button with min width/height equal to the
> contained icon:
This sounds like basically a dupe of bug 763689. (And if the reporter's requesting anything beyond that, it'd really need to be tracked in a spec issue rather than a Mozilla bug.)
Resolving as dupe of bug 763689.
Status: UNCONFIRMED → RESOLVED
Closed: 12 years ago
Resolution: --- → DUPLICATE
You need to log in
before you can comment on or make changes to this bug.
Description
•