div, css and columns

Discussion in 'HTML' started by Aioe, Oct 6, 2005.

  1. Aioe

    Aioe Guest

    A php script returns an output like this:

    <div class="sinistra">
    <dl>
    <dt>qualcosa</dt>
    <dd>altro</dd>
    [...]
    </dl>
    </div>

    <div class="destra">
    <dl>
    <dt>qualcosa</dt>
    <dd>altro</dd>
    [...]
    </dl>
    </div>

    i need a way to display these structures in two parallel columns (somewhat
    like the result of:

    <table>
    <tr>
    <td>
    [contents of first div structure]
    </td>
    <td>
    [contents of second div structure]
    </td>
    </tr>
    </table>

    is this possibile using *only* the css styles? If so, how can i *vertically*
    align these div structures? (they must start in the same row)

    thank you

    cheers
     
    Aioe, Oct 6, 2005
    #1
    1. Advertising

  2. Aioe

    Mark Parnell Guest

    In our last episode, Aioe <> pronounced to alt.html:

    > i need a way to display these structures in two parallel columns

    <snip>
    > is this possibile using *only* the css styles? If so, how can i *vertically*
    > align these div structures? (they must start in the same row)


    ..sinistra, .destra { float: left; width: 45%; }

    Depending on the context that may need adjusting, but should get you on
    the right track.

    --
    Mark Parnell
    http://clarkecomputers.com.au
    alt.html FAQ :: http://html-faq.com/
     
    Mark Parnell, Oct 7, 2005
    #2
    1. Advertising

  3. Aioe

    Andy Dingley Guest

    Aioe wrote:

    > is this possibile using *only* the css styles?


    Yes, because CSS applies to tables as well as <div>s.

    However it's _not_ possible to generate the exact presentation just by
    using two <div>s as you have here. A table is composed of cells within
    rows. The two <div>s each containing a list is composed of two columns
    that each contain cells (like newspaper columns). You'll find it hard
    to control vertical alignments. If this isn't a problem for this
    example, then follow Mark's advice with the floats.

    I'd suggest keeping the <table> and applying CSS to that. If you have
    "content" that really needs to be aligned in rows like this, then IMHO
    that's a reasonable justification for regarding it as a "data table".

    It's also possible to apply "table CSS" to non table HTML markup. This
    was really developed as an idea for rendering XML (not HTML) purely
    with CSS and making it look like a table. XML/CSS turned into a bit of
    a dead end and so the whole idea has never been widely implemented
    (i.e. don't use it).
     
    Andy Dingley, Oct 7, 2005
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Troy

    CSS Div, 3 columns

    Troy, Dec 29, 2003, in forum: HTML
    Replies:
    3
    Views:
    544
  2. Replies:
    4
    Views:
    941
  3. K Viltersten

    <div ... /> and <div ...></div>

    K Viltersten, Mar 30, 2009, in forum: ASP .Net
    Replies:
    4
    Views:
    757
  4. Dwayne Madsen

    Q: Div A inside Div B is larger than Div B

    Dwayne Madsen, Jun 1, 2005, in forum: Javascript
    Replies:
    1
    Views:
    197
    David Dorward
    Jun 1, 2005
  5. mscir
    Replies:
    3
    Views:
    321
    Martin Honnen
    Jun 26, 2005
Loading...

Share This Page