I can't make the bottom copyright/links/etc table line up. Previous versions and some browsers had it to the left by just the 20-pixel width of the shade image column; now it is all the way to the left.

Here's what I've tried to troubleshoot:
1) validated code and made changes to the extent I understand them and they don't mess up the layout more, as its requests for TR tags do.
2) outlined tags to confirm that open and close tags match
3) compared to "about" page, which does work, but that one hasn't been validated and seems to have more code problems -- but it renders fine in five browsers
4) many hours of trial and error
5) since the problem table is in a php include file, I ruled out that as the problem.

I have the same problem on the FAQs, index and compare packages pages, but I haven't put them through all those paces. They range from three-over-one to one-over one column layouts.

Can anyone figure this out? Thank you.

Dani AI

Generated

Quick summary and practical checks based on this thread: ' centering trick is a useful quick fix for an old table-based template, and is right that modern layouts should use CSS. For a legacy footer that sometimes sits a few pixels off-center, the usual culprits are stray margins/padding on the footer or its parent, a floated element above that isn't cleared, an image cell (like the shade graphic) affecting width, or rules in the stylesheet overriding the table's alignment. Because this template is old, changing the DOCTYPE or global CSS can have wide effects — proceed incrementally.

Steps to diagnose and fix

  1. Use the browser inspector to check the computed box model for the footer table and each ancestor (margins, padding, floats).
  2. Look for unclosed tags or a missing table cell above the footer (these still cause layout shifts even if the page mostly validates).
  3. Temporarily give the footer elements visible outlines to see where extra space comes from.
  4. Apply a targeted CSS patch (below) rather than altering page-wide styles or the DOCTYPE; that keeps the fix local and low-risk.

Quick, non-invasive CSS patch to try

/* wrap the footer include in #footer-wrap */
#footer-wrap { text-align: center; }

/* force the table to center and cancel any float */
#footer-wrap table { margin: 0 auto; float: none; }

/* if the shade graphic is a cell, make the image a block so it doesn't add inline gaps */
#footer-wrap img.shade { display: block; }

Notes and caution: test in multiple browsers after the change. If the footer still nudges, inspect parent widths and any leftover floats or negative margins. Longer term, consider a gradual move to CSS (flexbox/grid) for the footer when time permits; small, local fixes above let the site stay stable for launch.

Recommended Answers

All 6 Replies

Have you made presentation of the content in table? If yes, then the method is wrong. It is not recommended to use table as the styling can be done in CSS.

For validation, try http://jigsaw.w3.org/css-validator/

I understand that working without tables is ideal. I purchased this template without realizing it is several years old. My coding is not advanced enough to convert it, and in any case the website is 98% ready to launch.

I'd appreciate help from anyone who "remembers the old days" and can help me fix this, please. Also, like I said, I have already validated this page at and got it down to very few errors.

Add the attribute align="center" to the footer table.

Also, the site is 7-8 years old I'm guessing...it uses REALLY old HTML.

Thank you, FloatingDivs, the center tag mostly fixed it -- except now the footer table is slightly to the right. I have a shade graphic about that width - r3-fsbo-flip.jpg but I can't figure if that's involved or not. Would you be kind enough to take another look?

Yes, the template is from 2004 I think, but I just bought it this spring -- and the place I purchased it is still selling it. Caveat emptor.

It's this page still to the right -

I figured it out - thank you.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.