<table border=1>
<tr bgcolor="DCDCDC" valign="top">
      <td>Inställning</td>
      <td>Alternativ</td>
      <td>Exempel</td>
</tr>
<tr valign="top">
      <td>
      position
      </td>
      <td>
      absolute<br>
      relative<br>
      static
      </td>
      <td>
      <a href="css7.asp">Se separat kapitel om positionering</a>

      </td>
</tr>

<tr valign="top">
      <td>
      bottom
      </td>
      <td>
      auto<br><br>
      Eller ett mått t.ex. 50px<br>
      <br>
      Förutsätter att <b>position</b> <br>
      attributet är satt
      <br>

      </td>
      <td>
      <DIV STYLE = "position:absolute; bottom:50px"><br>
      Denna text kommer 50 pixels från<br>
      sidans slut<br>
      </DIV>
      </td>
</tr>
<tr valign="top">
      <td>
      clip
      </td>
      <td>
      auto (visar allt)<br><br>
      rect(top höger botton vänster)
      <br>
      Förutsätter att <b>position</b> <br>
      attributet är satt<br>
      Endast IE5
      <br>
      </td>
      <td>
      <DIV Style="position:absolute;<br>
      clip:rect(10px auto auto 10px)"><br>
      <IMG SRC="./images/asp_right.gif"><br>
      </DIV><br>
      <DIV Style="position:absolute;clip:rect(10px auto auto 10px)">
      <IMG SRC="../images/asp_right.gif">
      </DIV>
      <br>
      <br>
      <br>
      Ovanstående bild är klippt 10 <br>
      pixels i toppen och till jänster
      </td>
</tr>
<tr valign="top">
      <td>
      top<br>
      bottom<br>
      left<br>
      right<br>
      height<br>
      width<br>
      </td>
      <Td>
      Möjlighetet att bestämma placeringen och
      storleken på ett objekt<br>
      Används oftast med DIV
      </td>
      <td>
      <DIV STYLE="position:absolute;left:100px"><br>
      <IMG SRC="cone.jpg"><br>
      </DIV>
      </td>
</tr>
<tr valign="top">
      <td>
      overflow
      </td>
      <Td>
      visible<br>
      scroll<br>
      hidden<br>
      auto<br>
      <br>
      Hur browsern skall hantera text <br>
      som inte får rum...
      </td>
      <td>
      Nedan är olika varianter av<br>
      <DIV STYLE="width: 100px; height: 100px; <br>
      overflow: xxx;"><br>
      Här kommer en text som INTE får rum på 100x100 pixels<br>
      </DIV>
      <p>
      overflow: auto;<br>
      <DIV STYLE="width: 100px; height: 100px; overflow: auto;">
      En text En text En text En text En text En text En text En text En text En text En text En text En text En text En text En text En text
      </DIV>
      <p>
      overflow: visible;<br>
      <DIV STYLE="width: 100px; height: 100px; overflow: visible;">
      En text En text En text En text En text En text En text En text En text En text En text En text En text En text En text En text En text
      </DIV>
      <p>
      overflow: hidden;<br>
      <DIV STYLE="width: 100px; height: 100px; overflow: hidden;">
      En text En text En text En text En text En text En text En text En text En text En text En text En text En text En text En text En text
      </DIV>
      <p>
      overflow: scroll;<br>
      <DIV STYLE="width: 100px; height: 100px; overflow: scroll;">
      En text En text En text En text En text En text En text En text En text En text En text En text En text En text En text En text En text
      </DIV>
      </td>
<tr valign="top">
      <td>
      z-index
      </td>
      <Td>
      Möjlighetet att bestämma hur
      <br>
      överlappande objekt kommer i djupled.<br>
      Ett högre värde på z-index gör att <br>
      objektet kommer ovanpå ett som har ett<br>
      lägre värde
      </td>
      <td>
      <DIV STYLE="position:relative; z-index: 1; color: red; font: italic 30pt arial" >
      z-index:1 </DIV>
      <DIV STYLE="position:relative; top: -30; z-index: 4; color: blue; font: bold 30pt arial">
      z-index:2 </DIV>
      </td>
</tr>
</table>