Click to See Complete Forum and Search --> : html table help


Htmlwiz
12-31-2006, 03:52 PM
is there any way to code tables so i could have them like this?


iiiiiiiiiiiiiiiiiiii
i Links i
i---------i
i---------i
i---------i
i---------i
i---------i
i---------i
iiiiiiiiiiiiiiiiiiii

iiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii
i Announcements i
i date 10/10/10 i
i i
iiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii

But have it where the top of the announcements table would be even witht he top of the Links table and the bottom of the announcements table would go to about the middle of the Links table and i would have maybe this much (I I)
space between the two tables?


EDIT: I realise i suck at making tables with only the letter I to use but hey im new at this stuff

NogDog
12-31-2006, 04:54 PM
HTML tables are for tabular data, not for controlling the visual presentation of non-tabular text. What you really want to do is learn how to use CSS for specifying the visual display of your pages. (Both sets of data are lists, so they should be UL or OL lists, not tables, and then you can use CSS to float them or absolutely position them to get the desired layout.)

Learning CSS (http://www.w3.org/Style/CSS/learning)
Why tables for layout is stupid: problems defined, solutions offered (http://www.hotdesign.com/seybold/)
HTMLDog.com CSS tutorial (http://htmldog.com/guides/cssbeginner/)
W3.org CSS specification (http://www.w3.org/TR/CSS21/)

Htmlwiz
12-31-2006, 06:59 PM
i use tables to hold the data in clean sections

NogDog
12-31-2006, 07:24 PM
i use tables to hold the data in clean sections
I understand, but I am suggesting that there is a better way to do it that (1) reduces the size of the HTML text that must be transferred, (2) makes it much easier to change the layout of the page should you so desire, (3) makes the page more accessible (such as to text-to-speech readers).

But even if you insist on using tables for non-tabular data (or when you correctly use them for tabular data), you can still use CSS to control their appearance, placement, and margins.

For a few examples of what can be done with CSS and not a single table, check out the different layouts at www.csszengarden.com. Each layout uses the exact same HTML -- the only difference is the CSS stylesheet file that each page references (along with the graphics files called by those stylesheets. (Or for that matter, see my home page (http://www.charles-reace.com) for a less artistic example done without any HTML tables.)

Htmlwiz
12-31-2006, 08:33 PM
how did you get it with the links over on the left and text in the center and then the "I use and recommend" section to the left?

Weedpacket
01-01-2007, 12:46 AM
Try putting that ASCII art in [code]...[/code] blocks. It would be much more legible.

And yes, CSS is exactly what this sort of thing was designed for. (If you want to see how NogDog did his home page, have a look at its HTML and CSS - you've got it all there on your computer.)

Htmlwiz
01-01-2007, 02:16 AM
Weedpacket did you perhaps read the book 1984 or whatever its called?

NogDog
01-01-2007, 02:58 AM
how did you get it with the links over on the left and text in the center and then the "I use and recommend" section to the left?
Basically, I set the left and middle columns to "float: left;" and the right column to "float: right;". The actual stylesheet is at http://www.charles-reace.com/include/style.css. (By using this same stylesheet on most of the pages in my site, the browser only has to download it - and the images it references - one time, greatly speeding up subsequent page loads.)

For some basic 2- and 3-column layouts that you could start with as templates to help learn CSS, you might want to look at the BlueRobot.com Layout Reservoir (http://www.bluerobot.com/web/layouts/). (Mine might be a bit of a mess to start with, as it sort of built up via "accretion" and probably could use some reorganization and streamlining. :) )

Htmlwiz
01-01-2007, 03:20 AM
ok thanks for your help...btw check out my forums at Piratehaven.co.nr...Im using it as my Code Library for any interesting codes i come across..as well as a Safe Haven for any Internet Pirates