Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Wrong initial position for elements if container has any margin. #2

Open
ervasive opened this issue Sep 26, 2012 · 10 comments
Open

Wrong initial position for elements if container has any margin. #2

ervasive opened this issue Sep 26, 2012 · 10 comments
Labels

Comments

@ervasive
Copy link

Hello Yannis, first of all, let me thank you for such a great and very helpful plugin.

I'm trying to build a grid of elements (in my case with fixed width), with some margins between those elements. The technique that I use, implies a negative margin for elements container (to normalize positions for first element in each row) and a positive margin for elements in a grid.

Now on initial placement I have some miscalculated position for elements but after any following reflows (e.g. window resize) position recalculates more accurate.

Here is an example: http://jsfiddle.net/S9eBE/

Thank you!

@yconst
Copy link
Owner

yconst commented Sep 27, 2012

Thanks for pointing this out. It seems that it is related to setting width in percentage, i.e. if you set a fixed width (e.g. 200px) it works fine..

I'll be looking into this one, thanks

@niallthompson
Copy link

I am also trying to columns/images with a percentage width.

Is that possible?

5in4 added a commit to 5in4/Freetile that referenced this issue Jan 5, 2013
container.freetile('layout'); is not prevented when $(window).resize();
is called. Workaround for issue yconst#2; not a fix
@vinha
Copy link

vinha commented Feb 19, 2013

One thing I noticed creating my em-based grid, was that Freetile had problems if the em-width couldn't be converted to exact pixel dimensions. For example, if 1 em is 16 px, and the tile width is 1.666 em.

Using percentages for widths, it would be easy to end in situation like this.

@elihorn
Copy link

elihorn commented Apr 11, 2013

I don't know whether anyone resolved this, but I am also having the same problem. The solution I came to was to simply fire the layout function twice as shown below. This doesn't seem very elegant, but is a quick, easy fix. Any other developments out there on this issue?

target.freetile().freetile('layout')

@camelot3000
Copy link

elihorn - I tried your solution - But - The solution you proposed fixed an issue in ie9 but broke freetile in ie10 and ie8 in my case - I've never had issues in decent browsers. People might want to add that to their list of tests while implementing.

@VincentJousse
Copy link

Hello Yannis, have you any news about this bug to give us ?

@yconst
Copy link
Owner

yconst commented Jul 29, 2013

@VincentFTS Not really. Tried @desandro's getSize to circumvent this but it broke some stuff so I had to let it go.

@framini
Copy link

framini commented Sep 20, 2013

Any news on this?

@protherj
Copy link

I was able to get it working by doing a 'layout' call after a timer. Something like this:

    setTimeout(function() {
         $('.section').freetile('layout');
    }, 1000);

-Jason

@gyopiazza
Copy link

I know this is an old post but the issue persists and I found a cleaner way to call layout:

target.freetile({
  callback: function(){
    target.freetile('layout');
  }
});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

10 participants