Shape Position Example (VML)


Purpose

This example demonstrates the effect of position on VML shapes and surrounding content. The VML shape is positioned absolutely within a relatively positioned DIV element.

Example

Beginning of the shape: End.













Code

<!-- Include the VML behavior -->
<style>v\:* { behavior:url(#default#VML);display:inline-block }</style>

<!-- Declare the VML namespace -->
<xml:namespace ns="urn:schemas-microsoft-com:vml" prefix="v" />

<div style="position:relative; background-color:#CCCCFF; border-width=0px">
Beginning of the shape:
<v:oval style="position:absolute;left:20pt;top:10pt;width:80pt;height:90pt" fillcolor="red" />
End.
</div>