Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p><a href="http://isotope.metafizzy.co/" rel="nofollow">JQUERY ISOTOPE</a> has propery</p> <p>when there are more cell then it take automatic first cell height and width and assign all cell like according to the first cell</p> <p>if you want to item width and height greater than other div. then on this item assign custom style and give height and width</p> <p>i see your css in <a href="http://jsfiddle.net/S5vAG/1381/" rel="nofollow">http://jsfiddle.net/S5vAG/1381/</a> and set code in <strong>CSS</strong></p> <pre><code>.item.large { width: 300px; background: #2D6; height:200px; z-index: 10; } </code></pre> <p>like <strong>HTML</strong></p> <pre><code>&lt;div id="container"&gt; &lt;div class="item"&gt;1&lt;/div&gt; &lt;div class="item large" style="width:200px;height:300px"&gt;2&lt;/div&gt;&lt;!-- you can use your desire width and height --&gt; &lt;div class="item"&gt;3&lt;/div&gt; &lt;div class="item"&gt;4&lt;/div&gt; &lt;div class="item"&gt;5&lt;/div&gt; &lt;div class="item"&gt;6&lt;/div&gt; &lt;div class="item"&gt;7&lt;/div&gt; &lt;/div&gt; </code></pre> <p><strong>and in js</strong></p> <pre><code> (function($) { var $container = $('#container'); $(window).load(function(){ // add randomish size classes $container.isotope({ itemSelector : '.item', layoutMode : 'masonry', }); $container.isotope("reLayout"); }); })(jQuery); </code></pre> <p>then it set desire height and width and set like other item with different height and width</p> <p>i have set this code in my client site you can see <a href="http://cosmosfactors.com/black-theme-xyfactors36/diseases/The-symptoms-of-Gonorrhea" rel="nofollow">here</a></p> <p>it is anew theme of <a href="http://xyfactors.com" rel="nofollow">XYFACTORS</a></p> <p>but for your problem you see my demo link i have apply this functionality in demo all pages </p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload