Summary: Absolute positioned elements were not correctly respecting border / padding. https://github.com/facebook/css-layout/issues/245 fixes #245 Reviewed By: gkassabli Differential Revision: D4153332 fbshipit-source-id: 251e29e02018a433f60349b78c03feb121512797
27 lines
1.4 KiB
HTML
27 lines
1.4 KiB
HTML
<div id="absolute_layout_width_height_start_top" style="width: 100px; height: 100px;">
|
|
<div style="width:10px; height: 10px; position: absolute; start: 10px; top: 10px;"></div>
|
|
</div>
|
|
|
|
<div id="absolute_layout_width_height_end_bottom" style="width: 100px; height: 100px;">
|
|
<div style="width:10px; height: 10px; position: absolute; end: 10px; bottom: 10px;"></div>
|
|
</div>
|
|
|
|
<div id="absolute_layout_start_top_end_bottom" style="width: 100px; height: 100px;">
|
|
<div style="position: absolute; start: 10px; top: 10px; end: 10px; bottom: 10px;"></div>
|
|
</div>
|
|
|
|
<div id="absolute_layout_width_height_start_top_end_bottom" style="width: 100px; height: 100px;">
|
|
<div style="width:10px; height: 10px; position: absolute; start: 10px; top: 10px; end: 10px; bottom: 10px;"></div>
|
|
</div>
|
|
|
|
<div id="do_not_clamp_height_of_absolute_node_to_height_of_its_overflow_hidden_parent" style="height: 50px; width: 50px; overflow: hidden; flex-direction: row;">
|
|
<div style="position: absolute; start: 0px; top: 0px;">
|
|
<div style="width: 100px; height: 100px;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="absolute_layout_within_border" style="height:100px; width:100px; border-width: 10px; margin: 10px; padding: 10px;">
|
|
<div style="position: absolute; width: 50px; height: 50px; left: 0px; top: 0px;"></div>
|
|
<div style="position: absolute; width: 50px; height: 50px; right: 0px; bottom: 0px;"></div>
|
|
</div>
|