English | >> česky << | PortuguêsZVON > Tutorials > CSS2 tutorial
>> Příklad 53 << | Předešlý | Následující | Index | Obsah

Absolutně umístěně obdélníky jsou vyňaty z normálního toku dokumentu. To znamená, že nemají žádný vliv na umístění následujících elementů.

XML dokumentCSS stylOdkaz na příklad
(1)
     <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>

BBB {display:block; position:absolute; left:12ex;
color:red; font-weight:bold}
Zobraz výstupy
XML dokumentCSS stylOdkaz na příklad
(2)
     <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>

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}
Zobraz výstupy
XML dokumentCSS stylOdkaz na příklad
(3)
     <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>

AAA {display:block; position:absolute; left:145px;
right:145px;bottom:10px; color:red; font-weight:bold}
Zobraz výstupy