Difference between revisions of "Div links"

From MyWiki
Jump to: navigation, search
 
(10 intermediate revisions by the same user not shown)
Line 1: Line 1:
http://www.barelyfitz.com/screencast/html-training/css/positioning/ good
 
  
 +
http://www.barelyfitz.com/screencast/html-training/css/positioning/ good
 +
<source lang="html4strict">
 
  #div-1 {
 
  #div-1 {
 
  }
 
  }
Line 17: Line 18:
 
  }
 
  }
  
#div-1 {
+
#div-1 {
 
  position:relative;
 
  position:relative;
}
+
}
#div-1a {
+
#div-1a {
 
  position:absolute;
 
  position:absolute;
 
  top:0;
 
  top:0;
 
  right:0;
 
  right:0;
 
  width:200px;
 
  width:200px;
}
+
}
#div-1b {
+
#div-1b {
 
  position:absolute;
 
  position:absolute;
 
  top:0;
 
  top:0;
 
  left:0;
 
  left:0;
 
  width:200px;
 
  width:200px;
}
+
}
 +
 
 +
#div-1 {
 +
position:relative;
 +
height:250px;
 +
}
 +
#div-1a {
 +
position:absolute;
 +
top:0;
 +
right:0;
 +
width:200px;
 +
}
 +
#div-1b {
 +
position:absolute;
 +
top:0;
 +
left:0;
 +
width:200px;
 +
}
 +
 
 +
#div-1a {
 +
float:left;
 +
width:200px;
 +
}
 +
 
 +
#div-1a {
 +
float:left;
 +
width:150px;
 +
}
 +
#div-1b {
 +
float:left;
 +
width:150px;
 +
}
 +
 
 +
#div-1a {
 +
float:left;
 +
width:190px;
 +
}
 +
#div-1b {
 +
float:left;
 +
width:190px;
 +
}
 +
#div-1c {
 +
clear:both;
 +
}
 +
 
 +
</source>

Latest revision as of 11:51, 12 June 2014

http://www.barelyfitz.com/screencast/html-training/css/positioning/ good

 #div-1 {
 }
 
 #div-1 {
  position:relative;
  top:20px;
  left:-40px;
 }
 
 #div-1a {
 position:absolute;
 top:0;
 right:0;
 width:200px;
 }
 
 #div-1 {
 position:relative;
 }
 #div-1a {
 position:absolute;
 top:0;
 right:0;
 width:200px;
 }
 #div-1b {
 position:absolute;
 top:0;
 left:0;
 width:200px;
 }
 
 #div-1 {
 position:relative;
 height:250px;
 }
 #div-1a {
 position:absolute;
 top:0;
 right:0;
 width:200px;
 }
 #div-1b {
 position:absolute;
 top:0;
 left:0;
 width:200px;
 }
 
 #div-1a {
 float:left;
 width:200px;
 }
 
 #div-1a {
 float:left;
 width:150px;
 }
 #div-1b {
 float:left;
 width:150px;
 }
 
 #div-1a {
 float:left;
 width:190px;
 }
 #div-1b {
 float:left;
 width:190px;
 }
 #div-1c {
 clear:both;
 }