[Kerri Ann]

hi, i'm teaching myself html, and i'm trying to figure out what attribute i need to use for my situation-

i'm making a table, with 3 images in each row, and i want to space them evenly across the page, instead of using the cell padding attribute with pixels as the value. i know it's probably something simple, but i'm having trouble finding it on any reference pages...

can anyone help?

[Shadow2531]

FYI, tables are not to be used for layout/positioning purposes.

That's what divs/css are for.

Here's an example

(The example should give you a basis on how to do the layout. You will of course have to code it how you want it to look.)

(Just trying to save you from developing bad habits)

If you are not able to do it the right way I'm sure someone will make a tabled version for you.

If you still insist on using tables, here's an
example.

[Corrosive]

You can use percentages as well as absolute pixel values, if that helps. In your case, you'd probably want to make the table 99% wide and each cell 33% wide, so each is exactly the same size no matter what the users setup is.

Shadow: I know that tables are not to be used for positioning, but they frequently are. At times, it's actually better to flout the standards to allow for maintainability and backwards compatibility.

[Kerri Ann]

I'm just learning about all this stuff, so any constructive criticism is more than welcome. I haven't learned yet about that method of layout, only tables. Maybe you could tell me a little more about it?

Corrosive, thanks. I should have thought of using percentages....

[Kerri Ann]

actually, shadow, now that i look at your example of the table, that's not exactly what i was looking for. i wanted the table to change it's width as the page changes it's width. that way, the layout of the pictures doesn't get messed up if someone has a small screen resolution.

[Shadow2531]

Yep, that table example is set for a fixed layout.
You would just use variable sizes for everything if you want it to scale well.

Here is an example of a layout that scales well. (it's not a picture layout , but you can still learn from it.)

http://home.tbbs.net/shadow/hardforu...e%20layout.htm

Now a note on that div/css layout I linked in my first reply....

The layout will break at lower resolutions.

If you used a fixed layout, it won't break. The fixed layout would be better if the images have to stay the same size no matter what.

If you want a scalable layout with images, you are going to have to use variable height and width sizes for the pics. Then it will scale how you like it.

For example, use a 10% or 15% width and height for the images.

It all depends on if you want to pics to have a fixed size or not.

You could use the div for the layout and have a table of pics inside it, but if you want it to scale well, the pics will have to be variable.

If you fill us in on that, we can make a better example.

To see what I'm talking about for a fixed layout, change the #firstbox div width to width: 750px;

[khaki]

Originally posted by Shadow2531:
FYI, tables are not to be used for layout/positioning purposes.

you are correct about that (the reasoning for it concerns accessibility issues)...

but tables are still widely used for positioning and layout.... INCLUDING THIS SITE !!!.....

so it is sometimes difficult to convince newbies that tables are to be used for tabular data only.

I admire the fact that you offered the "tables version" link though
(as some people are not always so forgiving on this subject as others)

[Shadow2531]

Here's an example that maybe more convincing.

Again, it's just an example, but it should help.

http://home.tbbs.net/shadow/tsgforums/css%20float.html

It's XHTML 1.1/CSS Compliant, with the xml declaration purposely omitted to make IE render in standards mode.
(necessary for the margin-auto to work in IE.)

(it's not served as application/xhtml+xml, but we don't need to get into that at this point )

I don't recommend tables, but if someone does use them for a layout, I'm not going to dis them. (Unless they use 55 nested tables, when the same design only needs one)

I know what you mean though, I can think of a lot of people at www.hardforum.com that will shoot you if you use tables for a layout.

[Shadow2531]

@Kerri Ann

Here's a table-layout for you.

You would put each picture in a cell.

You can decrease the number of cells if you like.
You can change the size of the cells and set it up however you like.

The css code that keeps the page centered is

margin: 0px auto;

http://home.tbbs.net/shadow/tsgforum...piclayout.html

That should help.