search

AshesOfOwls / jquery.shapeshift

A dynamic grid system with drag and drop functionality.
http://ashesofowls.github.com/jquery.shapeshift/
MIT License
1.67k stars 311 forks source link

Overlap #12

Closed menardmam closed 11 years ago

menardmam commented 11 years ago

Here is my SUPER DUPER SIMPLE DEMO (to understand) and for some bizzare reason... there is an overlap from the hell.... can you tell me how to fix it ?

http://studioteknik.com/jquery.shapeshift-master/demo/mam.html

thanks in advance

AshesOfOwls commented 11 years ago

Ah yeah, that is because shapeshift requires that all elements be the same width.

Think of the way it sorts elements as if there were a bunch of columns next to each other. It will iterate over all the child elements and place each one into the current column with the lowest height. The way it calculates the width of each column is by taking the first child element and getting its width.

Currently I have a branch created which will bring in a feature that allows for elements with varying widths, however that will have the same caveat as the first which means each element has to have a common multiple. For instance, if you have a gutter of 10 pixels, and the first element is 100 pixels wide, an element that spans two columns will have to be 210 pixels wide. It will be a few days before I can get this finished and pulled into the master branch though.

Hope that helps.

menardmam commented 11 years ago

Make sens, tks

Marc-André Ménard 514-222-1070

Studioteknik.com Notreaventure.com Notre-petite-famille.com

On 2013-01-14, at 12:49 AM, "Scott Elwood" notifications@github.com wrote:

Ah yeah, that is because shapeshift requires that all elements be the same width.

Think of the way it sorts elements as if there were a bunch of columns next to each other. It will iterate over all the child elements and place each one into the current column with the lowest height. The way it calculates the width of each column is by taking the first child element and getting its width.

Currently I have a branch created which will bring in a feature that allows for elements with varying widths, however that will have the same caveat as the first which means each element has to have a common multiple. For instance, if you have a gutter of 10 pixels, and the first element is 100 pixels wide, an element that spans two columns will have to be 210 pixels wide. It will be a few days before I can get this finished and pulled into the master branch though.

Hope that helps.

— Reply to this email directly or view it on GitHub.