I have looked in the archives and googled, but I still cannot see how to do
I want to have a number of small divs (lets say they have equal width eg
100px) stacked next to each other but overall centred in a liquid center
I can stack them by using float left, but what I want is for the overall
stack to be centered in the centercontentdiv. And to make the solution
general so that the small divs can contain images, headings lists and paras.
I can do all this if I accept that the result will be a block of divs
aligned to the left. But it would be so nice to get symmetry by making them
overall centered, without having to fix the width of the center area. That
is as the area squidges, less small divs per line and as it widens, more
divs per line, but still nicely centered.
There does not seem to be a complete solution to this, although I would be
delighted if someone can tell me I am overlooking something.
I have tried creating an outer div with display: table-cell; this seems to
shrink wrap (in Firefox), but I still cannot make it center using margin: 0
auto; even putting it in a wrapper div with width 100%.
I have tried it with images and inline divs, this works to a degree, but
block elements inside the inline div then drop out. I would have thought
there would be a way to create a div with all sorts of content and then
treat the whole thing as inline, but it doesnt seem to work that way. (I
need to go back and read Eric's book again I know)
My plea is - does anyone have a working solution for this - ie small divs
with various content (but fixed width) that will block together according to
the browser width AND that will center in the middle of the screen. It
would just look so nice and would be a great Christmas present.
Currently I find myself having to fix the center area width whenever I want
to achieve nicely centered results and that's a shame.
Regards and Hopeful
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/