Position divs in a tag cloud structure without overlap?

views:

243

answers:

+1 Q:

Position divs in a tag cloud structure without overlap?

Hi, I wondered if someone could help.

I need to build a system that pulls numbers out of an array and displays them in a cloud like pattern (a range of different sizes and colours). I'm stumped on how to build a system to create the divs so they don't overlap and make a nice tight structure. Any pointers would be great.

Mock Up: http://img228.imageshack.us/my.php?image=example.png

+1 A:

I imagine you should look at some of the tag cloud generation mechanisms flying around out there and see how they do their business.

chaos 2009-02-21 20:51:26

Hi I have done but none that I can find do anything in regards to making the elements closer to one another so it looks visually better, typogrpahically. I will continue to dig however

2009-02-21 22:35:28

If I were trying to do that, I'd start by playing with the margin, padding, line-height and letter-spacing CSS properties on the divs.

chaos 2009-02-21 22:59:46

Isn't that the purpose of the margin in CSS?

I should imagine that setting a 1-px all-round margin will make sure that no div is less than a pixel from another.

Lansen Q 2009-02-23 03:07:24

The problem is the random placement, spacing, and sizing of each tag. CSS is still very grid-centric. Looking at his mockup, think of each tag enclosed in a box. All those gaps and overlaps that result would be tricky to pull off in CSS alone.

Mark Hurd 2009-02-23 04:06:28

ansaurus

tags:

views:

answers:

Position divs in a tag cloud structure without overlap?

related questions