Shoutbox

quote:

---

Originally posted by Sunshine
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.

---

Yeah, I've had similar experiences when trying to avoid tables.

quote:

---

Originally posted by CookieRevised
Tables are 100 times (if not more) easier then div's to create tables... And there is no such thing as overusing them.
...
This forum, unlike -dt- suggested, is a nice example of how to use tables in a good way.

---

Thank you, Cookie.

quote:

---

Originally posted by Chris Boulton
<table>
<tr>
  <td>Test</td>
</tr>
</table>

<div>Test</div>

---

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:

---

Originally posted by Killov
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.

---

I agree!

quote:

---

Originally posted by WDZ

quote:

---

Originally posted by Chris Boulton
<table>
<tr>
  <td>Test</td>
</tr>
</table>

<div>Test</div>

---

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?

---

you use other elements inside the div such as <span> or <p>

quote:

---

Originally posted by WDZ


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 but with the
<div> WTF do you do?

---

<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

quote:

---

Originally posted by Lee Jeffery
you use other elements inside the div such as <span> or <p>

---

Duh. That info alone isn't helpful.

quote:

---

Originally posted by Chris Boulton
<div style="float: right; width: auto;">Right</div>
<div>Left</div>

---

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?

Of course you can!

Have you seen http://csszengarden.com/?

http://cssvault.com/
http://www.cssbeauty.com/

You don't need the width, I just used it..

Float does what it sounds like it does, it floats something..

Perhaps you were after 3 columns?

<div style="float: left;">Left</div>
<div style="float: right;">Right</div>
<div style="text-align: center;">Center</div>

quote:

---

Originally posted by Chris Boulton
Have you seen http://csszengarden.com/?

---

Yeah, of course... just some CSS fanatics showing off.

quote:

---

You don't need the width, I just used it..

---

OK, I was just wondering if it was necessary to make this dodgy trick work...

quote:

---

Float does what it sounds like it does, it floats something..

---

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

quote:

---

Originally posted by Chris Boulton
Of course you can!

Have you seen http://csszengarden.com/?

http://cssvault.com/
http://www.cssbeauty.com/

You don't need the width, I just used it..

Float does what it sounds like it does, it floats something..

Perhaps you were after 3 columns?

<div style="float: left;">Left</div>
<div style="float: right;">Right</div>
<div style="text-align: center;">Center</div>

---

<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:

---

Originally posted by WDZ
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

---

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:

---

Originally posted by WDZ

quote:

---

Originally posted by Chris Boulton
Have you seen http://csszengarden.com/?

---

Yeah, of course... just some CSS fanatics showing off.

---

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...

quote:

---

Originally posted by CookieRevised
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).

---

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:

---

Originally posted by CookieRevised
The method of floating stuff and using multpiple layers to create "tables" with div's is more a hack then anything else...

---

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

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.

On these forums, all the lists (forums, posts, members, search etc...) use tables in the right way, and so do the topics themselves but using a table for the Rate this Thread/Forum Jump thing is silly.

We should wait for Guido's opinion, he is the resident expert on website design afterall

P.S. my website only uses DIVs, and I think it would be hard to do something like that in tables.

http://www.mozilla.org/ is another example of using only divs!

I tried to convert my site to tables but it just didnt work and it would have been to hard to edit.

The only good thing about tables are the alignment to all screen sizes.

imo, divs/css is easier to use when using Notepad and a Graphics Program!