Difference between revisions of "HTML div"

From Ilianko
(Created page with " <style> div {border:1px black solid} </style> <div style="position: relative; width: 728px; height: 200px; background-color:#CCCCCC"> <!--This is the containing div position: re...")
 
 
(7 intermediate revisions by the same user not shown)
Line 1: Line 1:
  <style>
+
<code><pre>
div {border:1px black solid}
+
<div style="position: relative; width: 728px; height: 200px; background-color:#CCCCCC">
</style>
+
  <!--This is the containing div position: relative to flow in sequence with the rest of the page.-->
 +
<div style="position: absolute; top: 70px; left: 255px; width: 240px; background-color: azure;">
 +
 
 +
position: absolute; top: 70px; left: 255px; width: 240px; background-color: azure; overall width 248px including 2*3px padding and 2*1px border; (no height)
 +
 
 +
</div>
 +
<div style="position: absolute; top: 10px; left: 3px; width: 240px; height: 150px; background-color: pink;">
 +
 
 +
position: absolute; top: 10px; left: 3px; width: 240px; height: 150px; background-color:
 +
pink; overall width 248px including 2*3px padding and 2*1px border
 +
</div>
 +
 
 +
<div style="position: absolute; top: 25px; left: 507px; width: 210px; height: 125px; background-color: yellow;">
 +
 
 +
position: absolute; top: 25px; left: 507px; width: 210px; height: 125px; background-color:
 +
 
 +
yellow; overall width 218px including 2*3px padding and 2*1px border
 +
</div>
 +
</div></pre>
 +
</code>
 +
 
 
<div style="position: relative; width: 728px; height: 200px; background-color:#CCCCCC"> <!--This is the containing div position: relative to flow in sequence with the rest of the page.-->
 
<div style="position: relative; width: 728px; height: 200px; background-color:#CCCCCC"> <!--This is the containing div position: relative to flow in sequence with the rest of the page.-->
 
<div style="position: absolute; top: 70px; left: 255px; width: 240px; background-color: azure;">
 
<div style="position: absolute; top: 70px; left: 255px; width: 240px; background-color: azure;">
Line 13: Line 33:
 
</div>
 
</div>
 
</div>
 
</div>
 +
 +
[[Category:ММС]]

Latest revision as of 11:17, 17 June 2011

<div style="position: relative; width: 728px; height: 200px; background-color:#CCCCCC">
 <!--This is the containing div position: relative to flow in sequence with the rest of the page.-->
<div style="position: absolute; top: 70px; left: 255px; width: 240px; background-color: azure;">

position: absolute; top: 70px; left: 255px; width: 240px; background-color: azure; overall width 248px including 2*3px padding and 2*1px border; (no height)

</div>
<div style="position: absolute; top: 10px; left: 3px; width: 240px; height: 150px; background-color: pink;">

position: absolute; top: 10px; left: 3px; width: 240px; height: 150px; background-color:
 pink; overall width 248px including 2*3px padding and 2*1px border
</div>

<div style="position: absolute; top: 25px; left: 507px; width: 210px; height: 125px; background-color: yellow;">

position: absolute; top: 25px; left: 507px; width: 210px; height: 125px; background-color:

 yellow; overall width 218px including 2*3px padding and 2*1px border
</div>
</div>

position: absolute; top: 70px; left: 255px; width: 240px; background-color: azure; overall width 248px including 2*3px padding and 2*1px border; (no height)

position: absolute; top: 10px; left: 3px; width: 240px; height: 150px; background-color: pink; overall width 248px including 2*3px padding and 2*1px border

position: absolute; top: 25px; left: 507px; width: 210px; height: 125px; background-color: yellow; overall width 218px including 2*3px padding and 2*1px border