div or table?

Discussion in 'HTML' started by Jim S., Feb 12, 2006.

  1. Jim S.

    Jim S. Guest

    am designing my page layout and I am confused which to choose, should I
    choose Tables or DIV for layout.
    any suggestions?

    Jim
     
    Jim S., Feb 12, 2006
    #1
    1. Advertising

  2. On Sun, 12 Feb 2006 21:00:52 +0100, Jim S. <> wrote:

    > am designing my page layout and I am confused which to choose, should I
    > choose Tables or DIV for layout.
    > any suggestions?


    Neither. Use the proper elements for the content you want to serve out to
    your visitor. So a paragraph is a paragraph. A header is a header, a list
    is a list, a table is a table, an abbreviation is an abbreviation. If
    something needs to be emphasized, you give it emphasis. There are so many
    elements around you could use (see
    <URL:http://www.w3.org/TR/html401/index/elements.html>, that is hard to
    imagine you think of content that can't be marked up with one of those.
    However, if there is content for which there is realy no specific element
    available, _than_ you use a div for a block level element and a span for
    inline content.

    Oh, and to answer your question: use CSS2.1 for layout
    <URL:http://www.w3.org/TR/CSS2/>.


    --
    ______PretLetters:
    | weblog | http://www.pretletters.net/weblog/weblog.html |
    | webontwerp | http://www.pretletters.net/html/webontwerp.html |
    |zweefvliegen | http://www.pretletters.net/html/vliegen.html |
     
    Barbara de Zoete, Feb 12, 2006
    #2
    1. Advertising

  3. Jim S.

    Jose Guest

    > Use the proper elements for the content you want to serve out to your visitor. So a paragraph is a paragraph. A header is a header, a list is a list, a table is a table, an abbreviation is an abbreviation.

    As a philosophy, I agree. But it doesn't always quite fit. Computers
    are like that. For example, I have a heading ("Seven pictures of
    Atlas") and the material for which this is a heading are in fact, seven
    ..jpgs. But I want to have, under the heading, "compare these to Baal".
    Why under? Because the subheading (I'll call it that for now) is
    subservient to and relates to the heading (or rather, to the material as
    a whole, which is embodied in the heading). The pictures are not
    subservient to the subheading, they are subservient to the heading. So,
    what I'm calling a subheading is not really a subheading, it's a
    something-else (for which there probably isn't an appropriate tag).
    Human readers would get it perfectly if the putative subheading were in
    smaller type, below the heading with no fuss.

    I can do that easily if I skip the heading stuff, and just specify both
    heading and subheading as "body text", centered, with "bigger" and "not
    so much bigger" as type sizes. This tells humans what it is (by virtue
    of the style), but doesn't tell the browser what it is.

    Or, I can apply some styling to the header. This is closer to ideal,
    since at least we can call a heading a heading, but we are then =still=
    using style to convey meaning (which is supposed to be what CSS is
    trying to outlaw).

    It just isn't always the case that you can tell the browser what a thing
    is, because the browser just doesn't have a big enough vocabulary.
    Computers have square holes, and pegs come in all sorts of shapes,
    sizes, and textures.

    Jose
    --
    Money: what you need when you run out of brains.
    for Email, make the obvious change in the address.
     
    Jose, Feb 12, 2006
    #3
  4. On Sun, 12 Feb 2006 23:04:51 +0100, Jose <> wrote:

    >> Use the proper elements for the content you want to serve out to your
    >> visitor. So a paragraph is a paragraph. A header is a header, a list
    >> is a list, a table is a table, an abbreviation is an abbreviation.

    >
    > As a philosophy, I agree. But it doesn't always quite fit.


    That's why there is a div and a span as elements. Still doesn't say
    anything on how they are supposed to look.

    > For example, I have a heading ("Seven pictures of Atlas") and the
    > material for which this is a heading are in fact, seven .jpgs. But I
    > want to have, under the heading, "compare these to Baal".


    Something like (ugly variant):

    <h1>Seven pictures of Atlas <span>compare these to Baal</span></h1>

    <ol>
    <li>pic1</li>
    <li>pic2</li>
    <li>pic3</li>
    <li>pic4</li>
    <li>pic5</li>
    <li>pic6</li>
    <li>pic7</li>
    </ol>

    And then:

    h1 {
    font-size:160%;
    font-weight:bold; }

    h1 span {
    display:block;
    clear:both;
    font-size:135%; }

    Or maybe (clean variant):
    Just put <div class="remark">compare these to Baal</div> underneath the
    heading, and create some appropriate styles for that div.remark. Since the
    content really seems to be nothing else, a div is perfectly appropriate
    for it.


    > Why under? Because the subheading (I'll call it that for now) is
    > subservient to and relates to the heading (or rather, to the material as
    > a whole, which is embodied in the heading). The pictures are not
    > subservient to the subheading, they are subservient to the heading. So,
    > what I'm calling a subheading is not really a subheading, it's a
    > something-else (for which there probably isn't an appropriate tag).


    Hence the div or the span. I know and understand that. But that still has
    nothing to do with your original question: use tables or divs for layout.
    You're confusing markup and looks.

    > I can do that easily if I skip the heading stuff, and just specify both
    > heading and subheading as "body text", centered, with "bigger" and "not
    > so much bigger" as type sizes. This tells humans what it is (by virtue
    > of the style), but doesn't tell the browser what it is.


    I know that certain markup has a certain look in graphical browsers (and
    no where else). That is why it is possible to confuse the two. Try your
    pages in Lynx or Opera (using the [Emulate Text Browser]) before anywhere
    else. There you will see that you shouldn't confuse looks and semantics of
    markup. Markup is to 'tell' a browser what something is. You style the
    elements with CSS to tell the browser how things should look.

    > Or, I can apply some styling to the header. This is closer to ideal,
    > since at least we can call a heading a heading, but we are then =still=
    > using style to convey meaning (which is supposed to be what CSS is
    > trying to outlaw).


    No. You are styling for the looks, and yes, that looks mean something to
    the human mind. At least for those who get to see those looks. For all
    others (text browser, braille browser, aural browser, screen reader) you
    give meaning through correct markup, which in it self will get
    interpreted. I don't have screen readers running, but I can imagine that a
    heading gets read different from a div or a paragraph.

    > It just isn't always the case that you can tell the browser what a thing
    > is, because the browser just doesn't have a big enough vocabulary.


    That is true. But there really is so much.


    --
    ______PretLetters:
    | weblog | http://www.pretletters.net/weblog/weblog.html |
    | webontwerp | http://www.pretletters.net/html/webontwerp.html |
    |zweefvliegen | http://www.pretletters.net/html/vliegen.html |
     
    Barbara de Zoete, Feb 12, 2006
    #4
  5. Jim S.

    Tommy Guest

    Barbara de Zoete wrote:

    > Oh, and to answer your question: use CSS2.1 for layout
    > <URL:http://www.w3.org/TR/CSS2/>.


    From that page...

    W3C Recommendation 12-May-1998

    It's not even worth to look at recomendation from this year!

    ;-O
     
    Tommy, Feb 13, 2006
    #5
  6. Tommy wrote:

    > W3C Recommendation 12-May-1998


    .... which was when CSS 2 was published

    > It's not even worth to look at recomendation from this year!


    What recomendation from this year? There hasn't been a new version of the
    language published in the last month and a half (and even if there was,
    browser support would probably be too weak to make it worth bothering
    about).

    --
    David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
    Home is where the ~/.bashrc is
     
    David Dorward, Feb 13, 2006
    #6
    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. K Viltersten

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

    K Viltersten, Mar 30, 2009, in forum: ASP .Net
    Replies:
    4
    Views:
    758
  2. jc
    Replies:
    10
    Views:
    3,669
    Kevin Scholl
    Jun 30, 2009
  3. 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
  4. mscir
    Replies:
    3
    Views:
    321
    Martin Honnen
    Jun 26, 2005
  5. Sundew Shin
    Replies:
    5
    Views:
    159
Loading...

Share This Page