Is there anyway to give a div the "grid" option in jQuery? I don't want to draw a grid on the div itself.
The idea is for smaller layers to snap into the bigger div, in a grid like manner.
+2
A:
If you're trying to draw a grid, then you'll need as many divs as cells you need, giving them some border, all floating left or right. Only then snap your contents inside them.
But if you only want to layout content in a grid-like fashion, then you only need to set fixed widths and heights for all divs, float them left and you're done.
Seb
2009-05-25 16:08:25
I don't want to draw a grid. I want to give a div, grid like properties. So that the smaller divs can snap inside it.
James Brooks
2009-05-25 16:13:58
Then giving them fixed width and height and making them float left inside a parent container should do the trick!
Seb
2009-05-25 17:18:31
+2
A:
if you asking to build a grid within a div, then you can accomplish this with CSS alone. There is a CSS template called 960 that lays out a page with grid in 12px or 16px increments and will take care of alignment and spacing.
This will help you accomplish your goal of the "snap-to" functionality as any element placed in the columns will adhere to the rules of the container div.
At the site is a link to a grid generator where you can play with the widths of the grid system and preview the results.
WARNING: Once you layout your pages with a CSS Grid you are in danger of wanting to fore go the use of tables, as the CSS is easier to manipulate and with a system like 960 you have cross browser support out of the box. This can be a good thing!
David Robbins
2009-05-25 16:29:21
I don't really want to have lots of layers generated, is there no way that you can define a region to snap smaller layers to?Something like the jQuery Photo Album example
James Brooks
2009-05-25 16:49:01
http://www.alistapart.com/articles/multicolumnlayouts/ is a good article on div columns and positioning. Again, what ever you embedded in to "column" div has the CSS applied to it, and obeys the rules unless you use the "clear" command and assign new CSS positions to the interior elements. I'm assuming by snap to you DO NOT mean animation of div's when they are rendered.
David Robbins
2009-05-25 17:06:53