Topic: Centering a Nested Table (Page 1 of 1)

I am having problems centering a nested table . here is the URL...

http://www.labelsinc.com/newsite/boxsitedesign/quotenovice.html

The Table in question is the one containing the various text fields on the form. On some browsers this form is aligning to the left of the table enclosing it. Can anyone give me the correct method to make it center correctly in all browsers?

(Edited by Rondavu on 07-13-2005 19:32)

http://validator.w3.org/
http://jigsaw.w3.org/css-validator/
Mozilla Firefox > Tools > JavaScript Console

What's wrong with the current site? I like it better.

(Edited by reisio on 07-14-2005 00:42)

Thanks for the heads up. I fixed all the validation issues, but my form is still aligning to the left. Is there any way to fix this?

I didn't mind the first or currently published site either, but management wanted a boxier dynamic navigation type site.

My problem is I'm strong artistically, but the code kicks my @#%@

(Edited by Rondavu on 07-14-2005 15:11)

FWIW I just checked in FF1.0.4 and the form was perfectly centered. In IE6 it wasn't.
Since you're using a fixed layout, don't waste more time and simply set the margins of the FORM ( or the padding of its parent, it's up to you ).

Now the question why you use a TABLE based layout while Tables for layout is stupid and JavaScript rollovers while CSS only rollovers are way better on every aspect ( and can be extended to CSS navigation matrix ) remain. And actually as a strong artistically person doing standard compliant and semantic HTML + CSS would help you as the markup would be über clean and easy to read/write and the CSS are not that hard once you've spent a little while struggling with IE's rendering bugs.

quote:

---

poi said:

FWIW I just checked in FF1.0.4 and the form was perfectly centered. In IE6 it wasn't.

---

Ah, that would explain that. I was looking at it in FF and thinking, "Hmm... looks centered to me."

But yes, setting the margins would seem to be the easiest way to do it.

___________________________
Suho: www.liminality.org | Cell 270 | Sig Rotator | the Fellowship of Sup

I'll try out the margin option. The reason I use tables for layout is because the support for any other method is bad. In other words, the guy who runs my company better be able to see it perfectly in AOL or I'm dead.

The reason I use javascript for the rollovers is once again because it's the only methoid that looks the same in every browser. I am very pleased with how they came out. Quite flawless.

Oh, ok if your client has some bandwidth fees to waste
As I said it takes a little time to be confortable enough with full CSS design but once you're done you don't regret the zillion of nested tables.

Every site I've seen that is designed without tables never looks the way the designer intended. I know it's the way everyone is supposed to be doing it, but if it doesn't work than why institute the methods currently?

To me it's almost like "show me a site designed with pure CSS, and I'll find a browser it doesn't work on"

(Edited by Rondavu on 07-14-2005 16:48)

Also, how do I set the margin for the table? Do I use a div tag with a css tag? Is there a margin attribute for the table tag?

quote:

---

Rondavu said:

Every site I've seen that is designed without tables never looks the way the designer intended. I know it's the way everyone is
supposed to be doing it, but if it doesn't work than why institute the methods currently?

---

Really...have you seen csszengarden.com or yahoo.com? List all the sites you've seen.

quote:

---

Rondavu said:

To me it's almost like "show me a site designed with pure CSS, and I'll find a browser it doesn't work on"

---

Show me any site that works the same in all browsers.
Show me a site with 50million tables that's easier to manage and serve than one with a page of semantic markup.

quote:

---

Rondavu said:

Also, how do I set the margin for the table? Do I use a div tag with a css tag? Is there a margin attribute for the table tag?

---

Try:

table { margin: 0 auto; }

quote:

---

The reason I use tables for layout is because the support for any other method is bad

---

I'm speechless...

I already did table {margin: 0 auto;} and it's not working. That's what it's currently set to in the CSS document.

Like I said before, the people I have to answer to view the web with old browsers and explaining why it isn't working would be like talking to a rock.

I admit that I don't have a damn clue when it comes to marking up a page exclusively with CSS. I have no idea how to transition from my photoshop layout concept of the website to HTML and CSS. As of now I create slices from guides and save as HTML and it makes tables.

I'll most likely attempt transistioning the site to CSS in my own time. Right now I'm on company time as in they want the site up ASAP and working perfectly.

quote:

---

I know it's the way everyone is supposed to be doing it, but if it doesn't work than why institute the methods currently?

---

You anwsered the question yourself : because that's way everyone is supposed to do. Standards are made to be used. Since they haven't been for years, it did not encouraged the browser vendors to comply to them thus the buggy rendering engines. It's time for a change.

Yesterday at work I've met a freelance web designer who claimed to be doing websites since 1995. The poor guys knew shit about CSS. He thought it was something new. Damn CSS are here since 96. When I see the websites of the company I working for it does not surprise me. With their clever table based layout it took me and a co-worker 3 man weeks to make a website designed for 800x600 go to 1024x768 while it'd have taken 1 man day maximum with CSS. Crap!

quote:

---

Is there a margin attribute for the table tag?

---

Of course. However if you love nested tables you could aswell nest the form in table and set the align attribute of the parent TD to center. Or you could also set the padding of the said TD. Or you could position the form in absolute to the center of the TD and set the margin to - half the width of the form ...

I've tried everything but the positioning absolute to the center of the TD. Why is this not working! It seems like such a simple task to make the content inside a TD cell center within that cell whether it be an image or an entire nested table.

since you've got a fixed layout (the widht doesn't change) have you thought about specifying the margin of the inside table? Or failing that put padding on the holding <td>.

Cheers,

I want to thank everyone for their help. Nothing worked so I cheated. That's life.

With all the talk of designing sites in CSS. I have been trying to switch from tables to CSS. Anyone know any good sites that teach this? Or at least site design in CSS?

+ Mike +

Why of course!

Naturally you could just do a search on Google and find a milllion and one sites explaining such things, the CSSZenGarden is an excellent showpiece and it's companion site Mezzoblue will teach you plenty, there are many better and broader sites but you'll no doubt find them linked from there.

But first and foremost you should take a look at CSS it will answer many questions you may have and certainly guide youi in the right direction, the FAQ section of the OzoneAsylum has much knoweldge.

Cheers,

Thanks alot Blaise. You were a big help!

+ Mike +