html - Positioned divs spilling out of container -


i'm trying use this jquery grid plugin, it's not working layout. images stacked on top of each other, seem spilling out of .main, , overlap footer. help? :c

body {  	padding: 0;  	margin: 0;  	color:      $fontcolor;  	background-color: #eee;  	font: 100% 'open sans', sans-serif;  	background-color:      $main-bg;  	width: 100%;  	height: 100%;  }    .container {  	margin: 0 auto;  	width: 80%;  	height: 100%;  }    .main {  	width: 100%;  	background-color:     $content-bg;  	  }    .grid-container {    background-color: #f9f9f9;    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.15);    margin: 20px auto;    position: relative; }    .grid-item {    display: inline-block;    font-size: 0;    position: absolute;   }    .grid-item img {    cursor: pointer;    display: block;    width: 100%; }
<body>    <div class="container">      <div class="main">  				<div class='grid-container'>  					<div class='grid-item'>  						<img alt='' src='stackgrid/example/img/short.jpg'>  					</div>  					<div class='grid-item'>  						<img alt='' src='stackgrid/example/img/tall.jpg'>  					</div>  					<div class='grid-item'>  						<img alt='' src='stackgrid/example/img/medium.jpg'>  					</div>  					<div class='grid-item'>  						<img alt='' src='stackgrid/example/img/tall.jpg'>  					</div>  					<div class='grid-item'>  						<img alt='' src='stackgrid/example/img/short.jpg'>  					</div>  					<div class='grid-item'>  						<img alt='' src='stackgrid/example/img/medium.jpg'>  					</div>  					<div class='grid-item'>  						<img alt='' src='stackgrid/example/img/medium.jpg'>  					</div>  					<div class='grid-item'>  						<img alt='' src='stackgrid/example/img/short.jpg'>  					</div>  					<div class='grid-item'>  						<img alt='' src='stackgrid/example/img/medium.jpg'>  					</div>  				</div>  			</div>      </div>    </body>

make sure initializing stackgrid in window load.

also try .reset() method.


Comments

Popular posts from this blog

c# - Validate object ID from GET to POST -

node.js - Custom Model Validator SailsJS -

php - Find a regex to take part of Email -