ZVON > References > CSS2 Reference
Intro / Search / ZVON

Go to Standard
Property: position
Inherited: no
Value: static | relative | absolute | fixed | inherit
Initial: static
Applies to: all elements, but not to generated content
Media: visual
Percentages: N/A

Examples:



     <XXX>
          <AAA>aaa</AAA>
          <BBB>bbb</BBB>
          <CCC>ccc</CCC>
          <DDD>ddd</DDD>
          <EEE>eee</EEE>
     </XXX> 		View
XXX * {border: solid thin red; width: 100px}
AAA {display:block;}
BBB {display:block; position:relative; left:50px}
CCC {display:block; position:relative; left:100px}
DDD {display:block; position:relative; left:150px}
EEE {display:block; position:relative; left:200px}


     <XXX>
          <AAA>aaa</AAA>
          <BBB>bbb</BBB>
          <CCC>ccc</CCC>
          <DDD>ddd</DDD>
          <EEE>eee</EEE>
     </XXX> 		View
XXX * {border: solid thin red; width: 100px}
AAA {display:block;}
BBB {display:block; position:relative; top:1em}
CCC {display:block; position:relative; top:3em}
DDD {display:block; position:relative; top:6em}
EEE {display:block; position:relative; top:12em}


     <XXX>
          <AAA>aaa</AAA>
          <BBB>bbb</BBB>
          <CCC>ccc</CCC>
          <DDD>ddd</DDD>
          <EEE>eee</EEE>
     </XXX> 		View
XXX * {border: solid thin red; width: 100px}
AAA {display:block;}
BBB {display:block; position:relative; right:0.5ex}
CCC {display:block; position:relative; right:1ex}
DDD {display:block; position:relative; right:1.5ex}
EEE {display:block; position:relative; right:2ex}


     <XXX>
          <AAA>aaa</AAA>
          <BBB>bbb</BBB>
          <CCC>ccc</CCC>
          <DDD>ddd</DDD>
          <EEE>eee</EEE>
     </XXX> 		View
XXX * {border: solid thin red; width: 100px}
AAA {display:block;}
BBB {display:block; position:relative; bottom:1ex}
CCC {display:block; position:relative; bottom:3ex}
DDD {display:block; position:relative; bottom:6ex}
EEE {display:block; position:relative; bottom:11ex}


     <XXX>
          <AAA>aaa</AAA>
          <BBB>bbb</BBB>
          <CCC>ccc</CCC>
          <DDD>ddd</DDD>
          <EEE>eee</EEE>
     </XXX> 		View
BBB {position:relative; left:12ex}
CCC { position:relative; left:4ex}
DDD { position:relative; right:4ex}
EEE { position:relative; right:11ex}


     <XXX>
          <AAA>aaa aaa aaa aaa</AAA>
          <BBB>bbb</BBB>
          <CCC>ccc ccc ccc ccc ccc</CCC>
          <DDD>ddd ddd ddd ddd</DDD>
          <EEE>eee eee eee ee eeee eeee</EEE>
     </XXX> 		View
BBB {display:block; position:absolute; left:12ex;
color:red; font-weight:bold}


     <XXX>
          <AAA>aaa aaa aaa aaa</AAA>
          <BBB>bbb</BBB>
          <CCC>ccc ccc ccc ccc ccc</CCC>
          <DDD>ddd ddd ddd ddd</DDD>
          <EEE>eee eee eee ee eeee eeee</EEE>
     </XXX> 		View
AAA {display:block; position:absolute; left:100px;
right:100px;top:10px; color:red; font-weight:bold}
CCC {display:block; position:absolute; left:10px;
right:200px; top:100px; color:purple; font-weight:bold}
DDD {display:block; position:absolute; left:200px;
right:10px; top:3em; color:green; font-weight:bold}
EEE {display:block; position:absolute; left:100px;
right:100px; top:240px; color:navy; font-weight:bold}


     <XXX>
          <AAA>aaa aaa aaa aaa</AAA>
          <BBB>bbb</BBB>
          <CCC>ccc ccc ccc ccc ccc</CCC>
          <DDD>ddd ddd ddd ddd</DDD>
          <EEE>eee eee eee ee eeee eeee</EEE>
     </XXX> 		View
AAA {display:block; position:absolute; left:145px;
right:145px;bottom:10px; color:red; font-weight:bold}


     <XXX>
          <AAA>AAAAA AAAAA</AAA>
          <BBB>bbb bbbb bbbb bbbb bbbbb</BBB>
          <BBB>aaa aaa aaa</BBB>
          <BBB>bbb bbbb bbbb bbbb bbbbb</BBB>
          <BBB>aaa aaa aaa</BBB>
          <BBB>bbb bbbb bbbb bbbb bbbbb</BBB>
          <BBB>aaa aaa aaa</BBB>
          <BBB>bbb bbbb bbbb bbbb bbbbb</BBB>
          <BBB>aaa aaa aaa</BBB>
          <BBB>bbb bbbb bbbb bbbb bbbbb</BBB>
          <BBB>aaa aaa aaa</BBB>
          <BBB>bbb bbbb bbbb bbbb bbbbb</BBB>
          <BBB>aaa aaa aaa</BBB>
          <BBB>bbb bbbb bbbb bbbb bbbbb</BBB>
          <BBB>aaa aaa aaa</BBB>
          <BBB>bbb bbbb bbbb bbbb bbbbb</BBB>
          <BBB>aaa aaa aaa</BBB>
          <BBB>bbb bbbb bbbb bbbb bbbbb</BBB>
          <BBB>aaa aaa aaa</BBB>
          <BBB>bbb bbbb bbbb bbbb bbbbb</BBB>
          <BBB>aaa aaa aaa</BBB>
          <BBB>bbb bbbb bbbb bbbb bbbbb</BBB>
          <BBB>aaa aaa aaa</BBB>
          <BBB>bbb bbbb bbbb bbbb bbbbb</BBB>
          <BBB>aaa aaa aaa</BBB>
     </XXX> 		View
AAA {position:fixed; top:10px;
color:red; font-weight:bold}
BBB {display:block; color:navy}



_____________________________________________
Reference Search | Sitemap | XML Glossary       ZVON | Systinet