[self-split] tables vs. divs - Printable Version -Shoutbox (https://shoutbox.menthix.net) +-- Forum: MsgHelp Archive (/forumdisplay.php?fid=58) +--- Forum: Skype & Technology (/forumdisplay.php?fid=9) +---- Forum: Tech Talk (/forumdisplay.php?fid=17) +----- Thread: [self-split] tables vs. divs (/showthread.php?tid=47369) [self-split] tables vs. divs by WDZ on 07-09-2005 at 10:10 AM
quote:Divs don't have cells or columns or rows. I've heard people say tables should be replaced by CSS, but I don't think anything can really replace the simplicity and usefulness of a good old table. They're a great and fairly reliable way to lay out the elements of a page. I've tried to use CSS positioning and aligning and all I got from it was a major headache. Discuss. RE: [self-split] tables vs. divs by Sunshine on 07-09-2005 at 10:20 AM
Making a homepage strictly outta divs aint easy, i tried it and gave up because i couldn't get it to center on all screen resolutions. You can use percentages but i think to let the second or third column on certain place you do need absolute positioning...not that difficult but when you want it to look good on all resolutions you get stuck. RE: [self-split] tables vs. divs by Eljay on 07-09-2005 at 10:21 AM
tip for centering RE: [self-split] tables vs. divs by Sunshine on 07-09-2005 at 10:25 AM Yeah ok Leejeffy i knew that, but how do you get divs starting at a certain place without having to absolute position it...and so it will look same on all screen resolutions (autoadjusting div width)? RE: [self-split] tables vs. divs by -dt- on 07-09-2005 at 10:26 AM
tables can be fine if not overused (I count over used as this forum lol) RE: [self-split] tables vs. divs by ShawnZ on 07-09-2005 at 03:30 PM
quote: <style> #randomdiv { position: absolute; left: 50%; margin-left: -100px; // Half of what you want the width to be top: 50%; margin-top: -100px; // Half of what you want the height to be width: 200px; height: 200px; } </style> <div id="randomdiv">This text is in a centered box 200x200 pixels big</div> Got the trick from TheGeek, thank him. There is one more possibly easier way to do it: <style> body { margin: 0px auto; width: 100%; height: 100%; } #randomdiv { margin 0px auto; width: 200px; height: 200px; } </style> Also, if you want something to be positioned around that, just center it at 50% and set the leftmargin to how far away it should be from the center RE: [self-split] tables vs. divs by hmaster on 07-09-2005 at 05:02 PM
I prefer divs, using tables get a bit complicated after a bit. RE: [self-split] tables vs. divs by CookieRevised on 07-09-2005 at 05:33 PM
quote:so???? that means absolutely nothing... quote:I'm sorry but this is nonsense... ------------------ Tables are 100 times (if not more) easier then div's to create tables... And there is no such thing as overusing them. There is however something like misusing them and not knowing when and how to use them (resulting in comments like "tables are crap and old"). eg: This forum, unlike -dt- suggested, is a nice example of how to use tables in a good way. Yes, it can be complicated to some, but with div's it would be much more complicated and div's are still not completely 100% supported and implemented in the same way in each and every browser. Tables are much more easier and structured then div's to use for tables once you're used to them and are used to the easy structure of tables. Heck they are made especially to create tables :/ div's not! Div's can be used in place of tables and there is no harm in doing it. But in most cases it isn't needed at all and div's can (should) be used for a lot more other things and not only for the purpose to replace tables because you think tables are crap. In fact div's can't be compared to tables at all, they are both a total different kind of html code... (and don't bring CSS into this as it has actually nothing to do with it since CSS can also be used with tables just the same. The only difference is that CSS is associated more with div's than with tables, making it a total misconception that div=css and table=old style non css html) I'm sorry, but those who say tables are redundant crap and shouldn't be used at all, should learn html a bit more. For each there is a proper time and place to use it ------------------ Exactly the same story goes for frames vs iframes, etc.. btw RE: [self-split] tables vs. divs by surfichris on 07-10-2005 at 04:02 AM
However. Tables should only be used to hold tabular data. For positioning headings etc it is (as dt suggested) just stupid. quote:<table> <tr> <td>Test</td> </tr> </table> <div>Test</div> Looks easier to me - and then if you want to further it you should be using CSS (even for the table) to promote accessibility and usability. quote:They're 100% supported in every browser, its apart of a very old HTML specification. Implemented in each browser would refer to the CSS, and it's basically because of Microsoft not following standards that things don't work outright. quote:Tables for tabular data, Div's for layouts. RE: [self-split] tables vs. divs by L. Coyote on 07-10-2005 at 04:19 AM
quote:It's not like the example you gave is terribly difficult. Besides, EASY != LESS CHARACTERS. For example, you worry less when sorting out the position and size of each cell, while the DIVs are a little more complicated to position. The problem I see with DIV is that it depends too much on CSS, and that is why it's always confused with said coding, and some browsers might have a difficult time with showing the website (because of new/old CSS, not because of DIV). Tables are supported in all browsers (just like DIV), but they don't require any advanced CSS for positioning. It makes it easy to sort out the content in it. The only times I use DIVs is when I have a small chunk of text with very different formats and they need to be in blocks. For such small space, using a table isn't exactly convenient. Meh, I'm rambling... RE: [self-split] tables vs. divs by WDZ on 07-10-2005 at 05:19 AM
quote:Yeah, I've had similar experiences when trying to avoid tables. quote:Thank you, Cookie. quote:But what if I want one button on the far left of the page and one button on the far right, both right across from each other? With the table, you just add another <td> but with the <div> WTF do you do? quote:I agree! RE: [self-split] tables vs. divs by Eljay on 07-10-2005 at 07:05 AM
quote: you use other elements inside the div such as <span> or <p> RE: [self-split] tables vs. divs by surfichris on 07-10-2005 at 07:08 AM
quote: <div style="float: right; width: auto;">Right</div> <div>Left</div> or.. <div style="float: left; width: auto;">Left</div> <div style="text-align: right;">Right</div> Or numerous other ways RE: [self-split] tables vs. divs by WDZ on 07-10-2005 at 07:24 AM
quote:Duh. That info alone isn't helpful. quote:Float, eh? What exactly does that do? And why do you need "width: auto"? So can you actually have 2 divs on the same "line" (not above or below the other) without using tables? RE: [self-split] tables vs. divs by surfichris on 07-10-2005 at 07:28 AM
Of course you can! RE: [self-split] tables vs. divs by WDZ on 07-10-2005 at 07:43 AM
quote:Yeah, of course... just some CSS fanatics showing off. quote:OK, I was just wondering if it was necessary to make this dodgy trick work... quote:So technically there can be more than one div in the same space? In that example, the left and right divs are floating above the center div and don't care that it's there? O_o RE: RE: [self-split] tables vs. divs by CookieRevised on 07-10-2005 at 09:33 AM
quote:<table> <tr> <td>left</td> <td>center</td> <td>right</td> <tr> </table> Is far more logic and easier to understand and doesn't need layers, nor CSS to pull it off... (and the more nested columns and rows you have, the less code you will have with tables compared to div's; in other words, this small example isn't a good way to show the big benefits of tables though) As I said, div it is almost always used in combination with stylesheets (heck you almost can't do anything with it if you don't). quote:By using stylesheets yes. But you can do just the same with tables if you want. The method of floating stuff and using multiple layers to create "tables" with div's is more a hack then anything else... quote:indeed and if they wanted to add a column spanning 4 rows between the already existing columns they will have a hard time finding the appropiate place, changing the code, etc.... While on the other hand if you used tables with something like that, you can add the column in no time without any effort... Oh and, depending on the CSS being used (and layers) pages with div's load relativly slower then with tables. And that is why tables aren't "shit" at all and are in fact in many circumstances far better then div's. The problem with div's is that most people are blinded by the CSS and all the rumors and misconceptions... RE: [self-split] tables vs. divs by surfichris on 07-10-2005 at 09:49 AM
quote:Had a look at the XHTML 2.0 specifications? You're EXPECTED to use stylesheets for all of your formatting. This is the way things are headed. Here are some interesting reads: http://phrogz.net/CSS/HowToDevelopWithCSS.html Why tables are bad for layout: http://phrogz.net/CSS/WhyTablesAreBadForLayout.html quote:I'm not saying tables are evil and should never be used - they should only be used when you're using tabular data (like alot of things on forums are). There is no point using DIV's to recreate tables in CSS, but I wouldn't call it a hack - it's just stylesheets. Using Semantic HTML promotes usability with websites, presenting data in an organisational way (for example, turn css off here and when the formatting is lost, the page becomes harder to read), reduces page size and blah blah blah RE: [self-split] tables vs. divs by saralk on 07-10-2005 at 10:28 AM
I think that tables are overused, when people use tables to display the whole site, that is overkill. I think that as Chris said, tables should be used for showing tabulated data, but divs should be used for content. Another advantage is that with DIVs/CSS it is easier to change the layourt of the whole site, just by editing a css file. RE: [self-split] tables vs. divs by hmaster on 07-10-2005 at 02:02 PM
http://www.mozilla.org/ is another example of using only divs! RE: [self-split] tables vs. divs by RaceProUK on 07-10-2005 at 02:41 PM ATM, my new site uses tables, but I may try a CSS-based layout, and see what I can do with it. Then I'll come back and say which is easier/better/smaller/sleeker etc. RE: RE: [self-split] tables vs. divs by CookieRevised on 07-10-2005 at 03:00 PM
quote:read it, interesting find... In fact I agree with all the things said there. However my strong wordings in this thread are to componsate the things most people think about tables... I never said tables are ideal for designing a whole site or a whole layout, of course they're not. The trick is indeed to know when to use them. But most people intend to simply think tables are only good for the scrapyard and for display 10 numbers over 5 rows and two columns and thus haven't much experience with them and thus tend to say things which are said by many people... quote:This is NOT an advantage of div's! This is exactly my point in what I say that most people have a big misconception about tables. Indeed, most people say things like this and then conclude that using tables is bad and shouldn't be done and div's should be use. This is not true... You can use CSS just as well in tables as you can everywhere else, in fact it works just the same. Thus, sorry but this is by no mean a valid argument to use div's over tables. quote:Using tables like that is not silly at all, it is in fact logic. Using only div's there would be silly... quote:There is nothing in the iframe which needs tables. However the grand layout (the page and iframe in the middle) could have been easly done with tables without problems. quote:Again, the grand layout (topheader, left area, middle area, right area) could have been perfectly and very easly be done with a table and it wouldn't have been any harder to edit it afterwards. The reason why it wouldn't "work" is probably because you didn't implemented it correctly... quote:I suspect in the case of http://www.rpsoftware.net/ it would be almost equally easy (that is, if you're talking about the grand layout - top and the three vertical areas). ------------- All this said, the forum does use many tables in the appropiate places. But some columns, rows or container tables (as I like to call them; tables to hold other tables) could have been stripped and aren't needed making the source more readable/manageable. But the problem with sites as this forum is that it uses templates and creates the final pages out of many pre-designed other pages, hence you get a bit more seemingly redundant tables. But I dare everyone who say tables are crap and div's is "the L33t" to make 1 simple thread page with div's only... PS: There is also the "problem" of what is called layouting: - Tables can be use for layouting the page (if appropiate). If you call layouting: determining which elements should be placed where in the overall scheme like the overall topheader and three distinct areas on hmaster5 and raceprouk's website. - Div's can be use for layouting the page (if appropiate). If you call layouting: coloring, identing, sizing, etc the things in the inner frame of Saralk's website. Thus layouting textblocks, lines, etc... RE: [self-split] tables vs. divs by surfichris on 07-10-2005 at 03:19 PM
quote:That's not an iframe.. That's simply a div with the overflow set.. quote:I agree there, which is why in newer versions of MyBB we've stripped alot of the redundant tables just used for containers and such. quote:* surfichris feels a challenge coming.. Now, would you like that with author information on the left or author information on the top above posts? RE: [self-split] tables vs. divs by Yousef on 07-10-2005 at 03:27 PM
I've been working with CSS quite a lot last year. Divs are associated with CSS because you need CSS to complete the divs. In other words, divs don't "layout themselves", like tables. This of course DOESN'T mean you can't use css on tables, or vice versa. RE: [self-split] tables vs. divs by CookieRevised on 07-10-2005 at 03:38 PM
lol... would be interesting to see this thread converted in a div only page (btw, no, the first one doing it will not win anything accept a big tap on the shoulder for the hard work ) quote:oh well, didn't bothered to look at the source Anyways, it could be done with a simple table also (with the div-block, iframe, hard coded picture, whatever, inside it) RE: [self-split] tables vs. divs by hmaster on 07-10-2005 at 03:47 PM
Yeh I take Cookies point. RE: [self-split] tables vs. divs by Eljay on 07-10-2005 at 04:12 PM
quote: top would be easy, problem at the side lies with making certain divs have the same height EDIT: if it was a challenge ill have a go now RE: [self-split] tables vs. divs by hmaster on 07-10-2005 at 06:12 PM
quote:Id like to see how much you can do RE: [self-split] tables vs. divs by Eljay on 07-10-2005 at 06:50 PM
quote: well it appears harder than it at first seemed and i gave up to continue work on stuff im actually getting paid to do lol RE: [self-split] tables vs. divs by Yousef on 07-10-2005 at 06:59 PM
I made a little start: http://www.msgweb.nl/plus_css_forum/. Looks like the hardest part is next. RE: [self-split] tables vs. divs by ShawnZ on 07-10-2005 at 07:08 PM padding: 5px tbh RE: [self-split] tables vs. divs by surfichris on 07-10-2005 at 10:27 PM
quote:Who says you have to do that? Put each post inside another div, specify the border and background colour there, and use one of your other div's (for the author or message column) to create a border down the middle. RE: RE: [self-split] tables vs. divs by mathieumg on 07-10-2005 at 11:13 PM
quote: This is my exact point of view! Don't even have to add anything RE: [self-split] tables vs. divs by ShawnZ on 07-10-2005 at 11:54 PM
quote: tbh make a parent box that holds all the posts, set its background color to the border color between posts and left/right post colums, then each post will be in a div, then each column of the post will be in seperate divs, and put padding-left: 1px for the left one and padding: 1px for the right one RE: [self-split] tables vs. divs by Eljay on 07-11-2005 at 07:19 AM
quote: no no no, that means you have the problem i mentioned of making them the same height, his solution is good and i might try it RE: [self-split] tables vs. divs by fluffy_lobster on 07-13-2005 at 02:45 PM
tbh, WHY are you even wasting the typing energy to convert a thread into divs RE: [self-split] tables vs. divs by saralk on 07-13-2005 at 02:58 PM
I think that we are trying to get the non tabular stuff into divs (at least thats what me and -dt- are saying). RE: [self-split] tables vs. divs by Eljay on 07-13-2005 at 04:07 PM
quote: thats what im saying too, the whole making a forum into divs thing was because cookie challenged us to but the tables that posts are in are just stupid tbh, document tree to get to my post is: html>body#all>table>tbody>tr>td>table>tbody>tr>td>table>tbody>tr>td>form>table>tbody>tr>td.tborder>table>tbody>tr>td.trow2>table>tr>td>font WTF i can see it needs to be in a table because its tabular data but no more than one is needed RE: [self-split] tables vs. divs by fluffy_lobster on 07-13-2005 at 08:41 PM
quote:Looks like a table to me. It has a header and two rows, one of which is divided into two columns. It's also in common with other more tabular contents. I should also point out that the latest version of mybb uses a default skin that is much more semantic, much less table-heavy. but it still uses <font> tags |