Treehouse: Grow your CSS skills. Land your dream job.

table without table

  • # May 14, 2010 at 1:52 pm


    I am building a website for a client who basically wants a table layout.

    I want to build it with divs instead.
    I am thinking of making 5 vertical div columns, with each of the red squares as seperate divs.

    Here is my questions:

    -How do I center my content in each of the divs?
    the content will be a combination of headers and differently shaped images.

    -Is there a smarter way of doing this?

    Thank You

    # May 14, 2010 at 5:44 pm

    Of course using tables is bad when used for layouts, but there are exceptions. For example, if the whole site’s layout is built to look like a table, then use a table. Trying to pull it off using divs might end up being less semantic. But who knows, I’m having a hard time wrapping my head around what your actual site will look like when there’s real content and images.

    Anyways. The content can be centered just like you center all content. As for the images, if can set them up as background images, you can use center center no-repeat and the images will automatically center themselves in the div/table.

    # May 14, 2010 at 5:45 pm

    The vertical align in a div has always been a tough one for me.

    If each div is going to be the same height, I think you can look into using the line-height method: … -with-css/

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

You must be logged in to reply to this topic.