SitePoint Sponsor

User Tag List

Results 1 to 25 of 25
  1. #1
    That's Right. notepad_coder's Avatar
    Join Date
    Apr 2002
    Location
    Colorado
    Posts
    835
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question <div> vs. <table>

    I have a question about putting stuff on a site. I have been using tables for everything and I dont see any problem with it but I have been told I should use CSS and when they say that I think "divs?", What do u guys think I should use more?
    - the lid is off the maple syrup again!

  2. #2
    Currently Occupied; Till Sunda Andrew-J2000's Avatar
    Join Date
    Aug 2001
    Location
    London
    Posts
    2,475
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have a question about putting stuff on a site. I have been using tables for everything and I dont see any problem with it but I have been told I should use CSS and when they say that I think "divs?", What do u guys think I should use more?
    <div>'s have a few attributes that can add functionality to a site. eg absolute positioning however dont put all you tables absolutely postition as half the time its messes up on different browsers.

    <div>
    <table></table>
    </div>

    is ok, if its not used all over the place.

    but why do you associate css to <div>'s, just use css directly on the table if any thing.

    Personally i would try to stick to tables.

  3. #3
    That's Right. notepad_coder's Avatar
    Join Date
    Apr 2002
    Location
    Colorado
    Posts
    835
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well I was told to stop using tables completly and use CSS, but the only way I can think of doing that is to use <div>'s, Many people I have asked say use tables but I was just wondering what other people thought.
    - the lid is off the maple syrup again!

  4. #4
    Currently Occupied; Till Sunda Andrew-J2000's Avatar
    Join Date
    Aug 2001
    Location
    London
    Posts
    2,475
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    there is a layout of sitepoint just using css but i cant remember where it is right now. Have a look around site point for it.

  5. #5
    SitePoint Wizard
    Join Date
    Oct 2001
    Location
    Tucson, Arizona
    Posts
    1,858
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Nathan,

    Your site would be easy to pull off in a completely CSS layout. The DIV element, which stands for "division," can be used to recreate table layouts most of the time. The main difference is in the document's structure, as TABLE was never meant to be used as a layout device.

    You can style DIV elements using CSS, and the code will be cleaner, faster, and more standards-compliant than if you continue using tables to lay out your pages.
    Last edited by mattjacob; Apr 12, 2002 at 00:18.

  6. #6
    That's Right. notepad_coder's Avatar
    Join Date
    Apr 2002
    Location
    Colorado
    Posts
    835
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    k, thanks, but I still don't get what's different between CSS and tables
    - the lid is off the maple syrup again!

  7. #7
    SitePoint Wizard
    Join Date
    Oct 2001
    Location
    Tucson, Arizona
    Posts
    1,858
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

  8. #8
    That's Right. notepad_coder's Avatar
    Join Date
    Apr 2002
    Location
    Colorado
    Posts
    835
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    So I should try to use <div>'s and CSS for layouts? When I was told I should use CSS for stuff its when I had someone look at http://www.nathantech.com/images/lay...reen/enter.php and I know basics about CSS1 but I didn't know you could verticle align stuff in it?
    - the lid is off the maple syrup again!

  9. #9
    SitePoint Wizard
    Join Date
    Oct 2001
    Location
    Tucson, Arizona
    Posts
    1,858
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Did you want to redo the enter page or the site in CSS? I can give you an example, and then you can use it as a model to follow.

  10. #10
    That's Right. notepad_coder's Avatar
    Join Date
    Apr 2002
    Location
    Colorado
    Posts
    835
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    No, I like to use tables, I just don;t get whats different. The guy told me I should use CSS and not tables, and I don't get what he means. I read a book today and I get how to position stuff but some stuff in CSS wont work in NN so I don't get it.
    - the lid is off the maple syrup again!

  11. #11
    SitePoint Wizard
    Join Date
    Oct 2001
    Location
    Tucson, Arizona
    Posts
    1,858
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Tables are meant for formatting, well, tabular data. Stuff like figures and numbers and such. Divs are just generic content containers, but CSS can be used to specify how divs should look. The DIV element in itself isn't CSS; it's just standard HTML.

    The reason you want to get away from using tables for layout is because that breaks the purpose and intent of them. All newer browsers (IE5+, Op5+, Moz/NS6, etc.) handle most CSS relatively well, so you can be assured of almost the same look across them. What we're talking about here is separating content from style, and you can't really do that using tables for layout.

    And, no, NS4 doesn't handle style sheets very well at all. But you can't blame it, it's about five years old. Plus, there's only a very small percentage of people who even use NS4 anymore, so I don't worry about it. I design for standards, which in turn is design for the newer generation of browsers.

  12. #12
    That's Right. notepad_coder's Avatar
    Join Date
    Apr 2002
    Location
    Colorado
    Posts
    835
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, I get it now, I sould use <div>'s and CSS for the layout and then use tables for the content.
    - the lid is off the maple syrup again!

  13. #13
    SitePoint Wizard
    Join Date
    Oct 2001
    Location
    Tucson, Arizona
    Posts
    1,858
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Only use tables for the content if the data is tabular (?) data. I mean, don't just throw crap into tables for the heck of using tables.

  14. #14
    Currently Occupied; Till Sunda Andrew-J2000's Avatar
    Join Date
    Aug 2001
    Location
    London
    Posts
    2,475
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Does anyone know where the example of sitepoint using completely css was?

  15. #15
    SitePoint Wizard
    Join Date
    Oct 2001
    Location
    Tucson, Arizona
    Posts
    1,858
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Wow! SitePoint.com even has a search function! http://www.webmasterbase.com/article/379/

  16. #16
    That's Right. notepad_coder's Avatar
    Join Date
    Apr 2002
    Location
    Colorado
    Posts
    835
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Argh I still don't get it, I have a code on my site:
    PHP Code:
    <?
    $info 
    file("aboutitems.txt");
    $list file("aboutlist.txt");
    $a 0;
    $b 0;
    $c 0;
    while (
    $about $info[$a]) {
        if (
    $b == 0$bgcolor "#fafafa";
        else 
    $bgcolor "#eaeaea";
        echo 
    "<tr>";
        echo 
    "<td align='left' valign='top' bgcolor='" $bgcolor "' width='30%'>&nbsp;<b>" $list[$c] . "</b></td>";
        echo 
    "<td align='left' bgcolor='" $bgcolor "'>&nbsp;" $about "</td>";
        echo 
    "</tr>";
        
    $a++;
        
    $b++;
        
    $c++;
    }
    ?>
    and I don't get how I could print that out using CSS and not tables?
    - the lid is off the maple syrup again!

  17. #17
    SitePoint Wizard
    Join Date
    Oct 2001
    Location
    Tucson, Arizona
    Posts
    1,858
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Could you give me an HTML version of the entire table?

  18. #18
    Currently Occupied; Till Sunda Andrew-J2000's Avatar
    Join Date
    Aug 2001
    Location
    London
    Posts
    2,475
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hehe, im lazy

  19. #19
    SitePoint Wizard Ian Glass's Avatar
    Join Date
    Oct 2001
    Location
    Beyond yonder
    Posts
    2,384
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey, that's pretty simple using tabelless CSS, I think:
    PHP Code:
    #  ... MICS. PHP CODE ...
    $rowClass = ($b == 0) ? "odd" "even";
    echo 
    "<div class=""".$rowClass."""><span class=""list"">".$list[$c]."</span>".$about."</div>";
    # ... MICS. PHP CODE ... 
    and then use this in your stylesheet:
    Code:
    .odd { background: #fafafa; height: 7em; }
    .even { background: #eaeaea; height: 7em; }
    .list {
      float: left;
      padding-left: 1ex;
      margin-right: 1ex;
      width: 30%;
      height: 100%;
    }
    Keep in mind that I don't know too much about PHP, but hopefully you get the general idea (and it doesn't erase your hard drive ;-). :-)

    ~~Ian

  20. #20
    Currently Occupied; Till Sunda Andrew-J2000's Avatar
    Join Date
    Aug 2001
    Location
    London
    Posts
    2,475
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Keep in mind that I don't know too much about PHP, but hopefully you get the general idea (and it doesn't erase your hard drive ;-). :-)

    dont they all say that when your hd is eaten alive
    Last edited by Andrew-J2000; Apr 17, 2002 at 00:18.

  21. #21
    That's Right. notepad_coder's Avatar
    Join Date
    Apr 2002
    Location
    Colorado
    Posts
    835
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    PHP can erase a hd? I never knew that.
    - the lid is off the maple syrup again!

  22. #22
    SitePoint Wizard
    Join Date
    Oct 2001
    Location
    Tucson, Arizona
    Posts
    1,858
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    :sigh: It was sarcasm.

  23. #23
    long gone but not forgotten AljapaCo's Avatar
    Join Date
    Aug 2001
    Location
    Sweden
    Posts
    548
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    *:sigh: It was sarcasm.*



    Funny
    T O B I A S - S T R A N D H | visit my site here
    OPERA7 /MSIE6 /FireFox 1.1/Win2000 /ADSL /17" Screen /1024x768
    god doesn't create genius, he clones me.............

  24. #24
    SitePoint Zealot GregShasta's Avatar
    Join Date
    Jul 2001
    Location
    atlanta ga
    Posts
    122
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    See http://alistapart.com/stories/journey/ for their conversion to all css. Now alistapart has taken the 'no bad browsers' stance which is great but if your a 'compatability' doctrinaire it might make you batty.

    Greg
    'I guess that my ambition was to be a bum'--robert mitchum

  25. #25
    SitePoint Wizard Ian Glass's Avatar
    Join Date
    Oct 2001
    Location
    Beyond yonder
    Posts
    2,384
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Actually, I it's very compatible with NS4 and older browser (i.e. it still works ["works" being the operative word]). It just ain't purrdy. :-)

    ~~Ian


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •