prisskreative
6/24/2014 - 3:21 PM

Basic-page

Basic-page

<!DOCTYPE html>
<html lang="en">
  <head>
  	<style>
  	@media screen and (min-width:480px){
  		/*****************************
  		TWO  COLUMN LAYOUT
  		******************************/
  		#primary{
  			width: 50%;
  			float:left;
  		}
  		#secondary{
  			width: 40%;
  			float:right;
  		}

  		/*****************************
  	    2.5 each side = 5
  		3 * 5 = 15 Total of margin 
  		100% - 15% = 85%
  		85% / 3 = 28.33333333333333

  		THREE  COLUMN LAYOUT

  		******************************/

  		#gallery li{
  			width: 28.3333%;
  		}
  		#gallery li:nth-child (4n){/***Clear left 4 element in 3 column layout***/
  			clear:left;
  		}

  		/*****************************
  		PAGE : ABOUT
  		******************************/

  		.profile-photo{
  			float:left;
  			margin:0 5% 80px 0;
  		} 
  	}

         
  	@media screen and (min-width:660px){
  		
  	}
  	</style>
  	<meta name="viewport" content="width=device-width, initial-scale=1.0">
  </head>

  <body>
<section id="primary">
</section>
<section id="secondary">
	</section>


  </body>
</html>