Table inside <div> tag

[kwdrysdale]

Ok...I know the "goal" is not to use tables for positioning, but it is the easiest way for me right now.   My question is probably fairly simple, but here goes.  Does the table alignment over-ride the <div> positioning?  For instance, if my div is set to be in the center of the screen and I have <table align="left"> will the table break from the <div> ???  Hope that makes sense and thanks for any replies.

 

Kevin

[phpQuestioner]

 

The table position should override the div; although I was thinking the opposite. I tested your question in FF and IE; the table with an alignment of left does override a 100% width div; that has a text/alignment of center. Although, really; you could have figured this one out on your own, but I went a head and tested it for you - because I am nice like that and I was bored.

[kwdrysdale]

Thank you for taking the time to test it.  I was looking at my code at almost midnight and thought I found the problem, so I thought I would ask here and see if someone already knew the answer rather than staying up later.  Thanks again.

[haku]

Unless you explicitly set the width of a div, it will be 100% of the width. So if you set the table alignment to left, it will align with the left of the screen, which is also the left of the div.

 

That being said, you are correct that you shouldn't be laying out your pages with tables!!

[Northern Flame]

That being said, you are correct that you shouldn't be laying out your pages with tables!!

 

really?

i've been using tables for in my coding because its easier

to position things, but why would it be better to use

div's?

[haku]

Tables only seem easier until you learn CSS

 

There are many reasons to use proper (x)html and css to layout your sites:

 

1) faster load times

2) easier to read code

3) easier to update code

4) higher SEO ratings

5) less code for the same design

6) ability to create designs that cannot be done with tables

7) ability to position elements more precisely than with tables.

 

Tables have been out for about 5 years now. Or at least they have in the rest of the world that's not Japan. Here they still use them lots, but *slowly* more people are starting to learn CSS and use it to position their sites.

[phpQuestioner]

 

There is nothing wrong with tables; it's really just a matter of preference.

[GameYin]

Like he said, I still use tables. I may not use the border attribute so noone knows it but.......

[haku]

There is nothing wrong with tables; it's really just a matter of preference.

 

Not at all. As far as SEO is concerned, tables rank lower. As far as speed of loading is concerned, tables take longer, and  have to download more data more often. And as far as separation of content and design, tables cannot compare. Tables also are bad for accessibility - screen readers for the blind do not work well with them at all. Finally, elements can be positioned much more precisely and fluidly with CSS, an example being a site that works on a 3-column layout for wide screen monitors, and two column layout for narrower screen monitors. That is impossible with tables.

 

Tables are the way of the past.

 

Like he said, I still use tables. I may not use the border attribute so noone knows it but....... Roll Eyes

 

I can spot a table layout instantly.

 

Don't get me wrong - tables have their place. They should be used for data that is tabular in nature. But site layouts are not tabular, and therefore sites should not be laid out with tables.

 

Hardly any (none?) of the major sites layout their sites with tables anymore. Check out yahoo, google, myspace, facebook, php.net, wikipedia, dictionary.com. They all use CSS, and none of them layout their sites with tables. Now if tables didn't matter, why would all these sites be using CSS?

[phpQuestioner]

There is nothing wrong with tables; it's really just a matter of preference.

 

Not at all. As far as SEO is concerned, tables rank lower. As far as speed of loading is concerned, tables take longer, and  have to download more data more often. And as far as separation of content and design, tables cannot compare. Tables also are bad for accessibility - screen readers for the blind do not work well with them at all. Finally, elements can be positioned much more precisely and fluidly with CSS, an example being a site that works on a 3-column layout for wide screen monitors, and two column layout for narrower screen monitors. That is impossible with tables.

 

Tables are the way of the past.

 

You have a right to your opinion; but it doesn't necessary mean it's true for every application. As I stated before; it's a personal preference - CSS is not the end all, be all of layout design - it's just there to style your "elements from the past" - as you describe them.

[haku]

If I am wrong, then why are all the major sites using CSS for positioning, and not tables?

[TheFilmGod]

Why CSS?

 

Did you ever try to create a fully dynamic website where every line of code is php? Try using tables for that...

Almost impossible.

 

Don't argue with me, unless you have created a 100% dynamic website like that and have a link to prove it.

[haku]

The huge majority of people on this site seem to be doing it. Have you looked at the PHP code posted? So many tables. Makes me cringe.

[phpQuestioner]

If I am wrong, then why are all the major sites using CSS for positioning, and not tables?

 

I did not state you were wrong; I just said it was a personal preference for different applications of web design. It is true that a large majority of people use CSS, no one is arguing with you there; but to say it is wrong to use tables - well that is just wrong.

 

You can use tables for pretty much anything; if you so desire to - again personal preference for application/layout design.

[haku]

I never stated that using tables was wrong. I stated that:

 

A) They have their place (tabular data).

B) Using them for layout is the wrong way to use them.

 

Obviously pages can be laid out with tables - they were for a long time (and still are in some cases), but its both an inferior way of laying out sites, and semantically, its the wrong way to use tables. Its not just me saying it either, its the W3C - and they are the guys who decide internet standards that browsers and search engines follow. So if the guys who are setting the standards are saying its the wrong way to use them, and the people who design the software (browsers) are following those standards (for the most part. Lets ignore IE for the moment), then it only makes sense that using tables to lay out sites is in fact an incorrect usage of tables.

 

Its like, I can build a house with clay. And I can build a house with wood, nails and stucco. Both of them will end up being houses, but you tell me which one is better.

[phpQuestioner]

That being said, you are correct that you shouldn't be laying out your pages with tables!!

 

Well that is pretty close to saying it's wrong. Web standards are fine and dandy; there is nothing wrong with them and you can follow them to a "T" - doesn't bother me either way; but just because someone tells you not to do something; do you listen to them aways or do you make your own mind up. That is the whole point of this discussion, personal preference. Until browsers stop using old school basic html elements and I seriously doubt that is going to happen any time soon; there is no reason why one person can use divs for layout and the other person use tables for layouts; they both have pros and cons to using them. I personally use a combination of both; depending on what I want to do. This is the problem with people who are all about CSS; there not well rounded enough designer to realize that there other options out there - become more diverse.

[haku]

You say there are positives and negatives to both - so lets hear some examples where it would be better to lay out a page with tables rather than CSS. And I'm curious about your cons to CSS. As you can tell, I'm in the CSS camp, but I'm more than willing to hear some reasoning behind what you are saying. I'm the kind of guy who is willing to change his opinion when people make sense.

 

there is no reason why one person can use divs for layout and the other person use tables for layouts;

 

Although the grammar was a little wrong here, I think I get what you were saying. I never said people can't use tables (in fact quite the opposite). I just said that its not a good way to. Although, depending on your examples, I may have to change my opinion on that.

[phpQuestioner]

 

You say there are positives and negatives to both - so lets hear some examples where it would be better to lay out a page with tables rather than CSS. And I'm curious about your cons to CSS. As you can tell, I'm in the CSS camp, but I'm more than willing to hear some reasoning behind what you are saying. I'm the kind of guy who is willing to change his opinion when people make sense.

 

there is no reason why one person can use divs for layout and the other person use tables for layouts;

 

Although the grammar was a little wrong here, I think I get what you were saying. I never said people can't use tables (in fact quite the opposite). I just said that its not a good way to. Although, depending on your examples, I may have to change my opinion on that.

 

Guy, you decide what you want to use - I believe TheFilmGod already gave you one good example and I don't have to give you any examples; but there are some css properties that can be used to display layouts that are not supported in every browser and you know this if you are the big css guy you say and act like you are and that is where tables come in; plus there easier to code for and supported by all browsers. I use CSS and have been doing so since I first began designing websites many years ago; but I choose layouts according to situations where I think they are appropriate. And I will continue to do so; as I said until tables are depreciated. And you don't worry about my grammar; I convey the point as need - ummm kaaaaa. (how's that for grammar - lol).

[haku]

I think you need to re-read what TheFilmGod said - his argument was in support of CSS, not tables.

 

Honestly, I was more than willing to listen to your reasoning about when tables are better than CSS. I have given a number of reasons why CSS is better. But for all you are speaking of how much tables are better, you haven't actually given any reasons why. So I've gotta say, I think I'll stick with CSS (except for tabular information).

[phpQuestioner]

 

You are so still missing the point; I never said they are better (it is you that says CSS is so much better and that is your opinion - I like to use both, as I already have said), I said it's a matter of personal preference and where are you getting your facts from - what did you do speed test tables versions of layouts verses css div versions of layout? And if so; on multiple browsers @ different internet speeds? You cannot prove to me that CSS has faster load time then tables; you cannot prove that. As far as easier to read code; that has nothing to do with layout design itself. As far as easier to update; you should be doing that dynamically if the web page has to be constantly updated. It is not really less code for same design; you have to make up the less html coding; with the more daunting task of making your css display accurately in every browser and that adds weight to your stylesheet. Plus you have to wait for your css to load your page structure; as where if you already had tables in place; guess what - you already got structure and your page does not look all funky at first. This just covers a few of your pros to css; that could be considered cons to others. I am not trying to get you to change your mind; that is not my goal. What I am telling you is that if someone so desires to use tables, instead of divs, too design the layouts; then that is "A Freak N OK". And you can build a fully dynamic site with tables if you choose to.

[haku]

it is you that says CSS is so much better and that is your opinion

 

Its also the opinion of the people who set the web standards, the W3C. I think I will choose to align my opinion with them over yours.

 

what did you do speed test tables versions of layouts verses css div versions of layout?

 

For an individual page, there may not be much of a difference. But once a CSS sheet has been downloaded once, it stays in cache (for a period of time), and is applied to each page that references it. With table based layouts, the positioning has to be downloaded (and coded into) every page, resulting in greater overall downloading times.

 

As far as easier to read; that has nothing to do with layout design itself.

 

Table based layouts are a mess of table, td and tr tags. Take those out, and it's quite easy to see what is going on. I suppose that this one could be considered a matter of opinion, although I think that the majority of people who have worked extensively with both would agree with me. Obviously you don't feel the same. Although I kind of wonder if you are just using CSS to design your tables rather than actually doing layouts with it.

 

As far as easier to update; you should be doing that dynamically if the web page has to be constantly updated.

 

Depends on what you are talking about. But lets say you decide that you want to change all the links in your site to blue from red, and drop the underline. That only has to be changed in one spot with CSS. It has to be changed with hundreds with tables.

 

It is not really less code for same design; you have to make up the less html coding;

 

Considering that one CSS sheet can be applied to every page on your site, and styles can be re-used, this means less code than putting your design into each and every page with tables.

 

with the more daunting task of making your css display accurately in every browser and that adds weight to your stylesheet.

 

Tables also display differently across browsers, so this is a non-issue, as it is no different from CSS.

 

Plus you have to wait for your css to load your page structure; as where if you already had tables in place; guess what - you already got structure and you page does  not look all funky at first.

 

I've already addressed this earlier - a css stylesheet only has to be downloaded once, then it is in your cache. Table based layouts have to download for each page each time you open that page.

 

As for waiting for your CSS to load - the CSS is included in the head. I don't ever recall seeing any pages in which the page loads and then the css is applied after the fact. Maybe they exist, but Im guessing its bad programming.

 

 

[phpQuestioner]

 

ok - let make break your theories/opinions down in points - lol

 

1.) More Power To You And Them - I Already Said You Could Follow That To A "T" - That It Didn't Matter To Me If You Did Or Not.

 

2.) You don't thinks that tables cache - are you for real - do you not think they had caches in browser back in the hay day of tables.

 

3.) DIV with Classes & IDs are no easier to find then <table> <tr> <td>; your still looking for the content that is with in them right?

 

4.) Styling an <a> element has nothing to do with layout design.

 

5.) CSS Stylesheets Just Creates A Template For Your Layout; If You Design You Site's Layout with Tables; You Done The Exact Same Thing; You Created A Template.

 

6.) Actually tables are pretty much cross browser compatible; where a good bit of css is not. Either it does not work the same way and you have to hack your way around it with even more css or it just does not work at all.

 

7.) So does a table - I already addressed this above too. No they do not have to download each time; they cache just like css does and sometimes if you wait X amount of minutes; css has to reload just like anything else does - I have seen it happen many times before. The actual page loads first and the css is applied sometimes after images load; because it's takes up more memory, hence longer load times, hence stylesheets my stall when loading.

 

Now did I cover all you opinions? You will not win this argument with me; it just ain't going to happen guy.

 

Sorry - I am the debating king and I don't give up!

[Northern Flame]

yea i agree with phpQuestioner

 

i've designed sites with divs and with tables,

and i dont think one is better,

but they each have their pros and cons and

you should decide when to use one or the other.

 

i personally like to use a combination of tables, divs, and css,

i use tables to structure the information, css to style the

page, and divs to hold information that i will most likely use

with javascript. I do not really like to design sites around

divs because they end up looking weird in other browsers and

then i have to code more css to make it work for every browser,

where as in tables, almost all the time they come out looking

almost exactly the same.

 

But when it comes down to it,

its a personal preference,

if you go your whole like while doing

the things that some people you

dont even know tell you is "correct",

then you're never really going to

learn for yourself.

 

As for seo,

I have never really seen any proof that

sites using divs rank higher, can you show

proof? im not saying you're wrong, im

actually starting to try to study seo tricks

and that is why im asking for proof so that

i can remember this for future reference.

[phpQuestioner]

 

Northern Flame you are my new best friend on here.

 

Thanks for your support - between this guy and bronzemonkey; I don't know which one thinks they are the biggest css guru on here - I really think they should have a show down - old western style - too see which one wins biggest css guru "wanna be" - I think they both might lose that one - lol.

[haku]

Now did I cover all you opinions? You will not win this argument with me; it just ain't going to happen guy.

 

There is no such thing as winning an internet argument. No one ever changes their opinion - it just gives those reading different points to think about.

 

You don't thinks that tables cache - are you for real - do you not think they had caches in browser back in the hay day of tables.

 

If you have two tables on two pages, they are hard coded into the page. They have to download on each page. If you re-visit a page, sure the table is cached. But if you visit a different page, the tables on that page download with the html on that page.

 

Styling an <a> element has nothing to do with layout design.

 

Not with layout, you are right. But its a point for CSS.

 

CSS Stylesheets Just Creates A Template For Your Layout; If You Design You Site's Layout with Tables; You Done The Exact Same Thing; You Created A Template.

 

Tis true, I can't argue with that one. If you are using external templates for your tables, then its essentially the same thing.

 

Actually tables are pretty much cross browser compatible; where a good bit of css is not. Either it does not work the same way and you have to hack your way around it with even more css or it just does not work at all.

 

If your structure if valid, conditional comments are few. Hacks should never be used. Tables on the other hand render differently across browsers and need to have sizes and styles etc applied to them - essentially what you are doing with CSS.

 

The actual page loads first and the css is applied sometimes after images load; because it's takes up more memory, hence longer load times, hence stylesheets my stall when loading.

 

Got any examples of this? Can't say I've ever seen it, but I have to admit that just because I've never seen it doesn't mean it doesn't exist.

 

 

Finally, some points that you didn't get into: CSS being better for accessibility, and for precision of layout. Any thoughts on these?

 

 

Now did I cover all you opinions? You will not win this argument with me; it just ain't going to happen guy.

 

Sorry - I am the debating king and I don't give up! (I can say it too)