Grow your CSS skills. Land your dream job.

positioning of block elements in columns

  • # October 31, 2009 at 11:50 am

    Hello, I need to display some data in a content pane. The data fields all have the same fixed size, but the number of fields is variable and it could become necessary to make the content pane resizeable.

    My html could look like this:

    Code:
    1
    2
    3
    4
    5
    6
    7
    8
    9

    I want the inner div’s to align vertical up to the bottom of the outer div and then start a new column. This shows how it should look:
    [img]http://i33.tinypic.com/2qxmcfm.png[/img]

    Can this be done without absolute positioning?

    # October 31, 2009 at 1:02 pm

    Looks like a table to me.

    # October 31, 2009 at 5:05 pm

    It looks like a table, but it’s not tabular data. The data is more or less an unordered list. I could use a table to realize the tabular design, but that would mess up the separation of content and design.

    I could use absolute positioning and generate the layout with js, but if it would be somehow possible to realize this without js that would be really great. Using a table wouldn’t help, because then I would have to generate the whole table with js.

    # October 31, 2009 at 6:14 pm

    In that case you could try playing about with a ul and maximum heights but this looks to be exactly what you need http://codeasily.com/jquery/multi-column-list-with-jquery

    # November 1, 2009 at 4:33 pm

    Thanks a lot, that was a good starting point! I hope to get something working in the next days.

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".