shape-outside Float Text-Wrap Note
Supplied shape bounds and margin envelope for an explicitly floated element; shape-outside does not wrap around an arbitrary nonfloat, no curve text layout. Explicit supplied computed/layout context only; not a browser cascade/layout engine or cross-browser guarantee.
Description
Shape-outside influences wrapping around an eligible float.
Shape-outside influences wrapping around an eligible float.1
A geometric extent calculation does not generate an actual shape contour or perform browser layout. Use shape-outside Float Text-Wrap Note to evaluate the supplied inputs under the specific model below.
When to use shape-outside Float Text-Wrap Note
Use shape-outside Float Text-Wrap Note to evaluate the supplied inputs under the specific model below. Define the supplied layout, token or rendering scenario and establish the relevant units and browser context independently.
How to use shape-outside Float Text-Wrap Note and understand its results
- Define the supplied layout, token or rendering scenario and establish the relevant units and browser context independently.
- Enter Is float, Caller shape bounds width px, Caller shape margin px using the field table and validation rules below, then run the tool.
- Read Conditional wrap extent px, Shape wrap eligible and interpret units, signs, ordering and placeholders as explained below.
- If the tool reports an input error, correct that field and rerun. A successful false result, empty match list or unknown-evidence placeholder has the specific meaning described here; check the limitations before applying the result.
| Input field | Meaning | Value type | Requirement |
|---|---|---|---|
| isFloat | Is float | boolean | Required; constraints below |
| callerShapeBoundsWidthPx | Caller shape bounds width px | number | Required; constraints below |
| callerShapeMarginPx | Caller shape margin px | number | Required; constraints below |
Enter a float-status boolean and nonnegative float width and symmetric horizontal margin in px. Eligibility is exactly the supplied float flag; the modeled extent is width+2×margin for a float and zero otherwise. No shape contour, image alpha threshold or actual wrapping layout is inspected.
eligible = isFloat; extentPx = isFloat ? widthPx+2×marginPx : 0 Field order, units and branch conditions follow the implementation explanation above.
| Output field | Meaning | Value type |
|---|---|---|
| conditionalWrapExtentPx | Conditional wrap extent px | number |
| shapeWrapEligible | Shape wrap eligible | boolean |
{
"input": {
"isFloat": true,
"callerShapeBoundsWidthPx": 100,
"callerShapeMarginPx": 10
},
"output": {
"conditionalWrapExtentPx": 120,
"shapeWrapEligible": true
}
}Limitations and assumptions
A geometric extent calculation does not generate an actual shape contour or perform browser layout. Apply the exact scope and assumptions described above.
All listed fields require explicit values. Unexpected fields, incorrect types, nonfinite numbers and sparse arrays fail validation. Domain-specific bounds, alignments and supported tokens are stated above; extremely large inputs or outputs can also be rejected. These errors differ from successful results such as false, no matches or unknown evidence.
Alternative or Complementary methods
Use minmax() Track Bounds Semantics Lookup for a related task: Grid minmax separates a minimum track constraint from a maximum sizing function.
Use Radial-Gradient Extent Keywords Lookup for a related task: A circular radial gradient can choose its radius by distance to box sides or corners.
References
-
shape-outside Float Text-Wrap Note — tool.io
Similar or alternative tools
- minmax() Track Bounds Semantics Lookup
Grid minmax separates a minimum track constraint from a maximum sizing function.
- Radial-Gradient Extent Keywords Lookup
A circular radial gradient can choose its radius by distance to box sides or corners.