I have an UL with 9 LI items laid out more or less like the image on the project's homepage. The difference is that UL has width and height set to 100% within a fixed-dimension container, and all LI items have width and height set to 33.33% and floated left.
What happens is that layout becomes broken in various ways when placeholder replaces one of the LI elements. I managed to fix this by removing the .css(...) part on line 124 (I am using the version of the code that can be downloaded from the download section).
I assume that the calculated width/height that jQuery returns doesn't exactly match the way browser calculates 33.33% in this case.
I have an UL with 9 LI items laid out more or less like the image on the project's homepage. The difference is that UL has width and height set to 100% within a fixed-dimension container, and all LI items have width and height set to 33.33% and floated left.
What happens is that layout becomes broken in various ways when placeholder replaces one of the LI elements. I managed to fix this by removing the .css(...) part on line 124 (I am using the version of the code that can be downloaded from the download section).
I assume that the calculated width/height that jQuery returns doesn't exactly match the way browser calculates 33.33% in this case.
Here is the relevant CSS I use:
.shuffleboard { position: relative; padding: 1em;
}
.shuffleboard ul { position: relative; margin: 0 auto; padding: 0; width: 100%; height: 100%;
}
.shuffleboard li { list-style: none; float: left; width: 33.333%; height: 33.333%; position: relative;
}
This work item was migrated from CodePlex
CodePlex work item ID: '33636' Vote count: '1'