For a GoLive guru: Problem rendering Adobe GoLive CS2 (Mac OSX) pages in Firefox.

I created a relatively simple site in GoLive -- just text boxes and
graphics on a layout grid without layers -- that renders perfectly in
GL's Preview feature. However, when I view them with Firefox 1.04, they
"blow up." In other words, the content is all there, but it's spread
all over the place, out of alignment on enormous pages and destroying
the page layout. Safari is much better, and IE (who knew?) does the
best job of all!

I've uploaded the site pages to a private server so that you can see
what I'm talking about. Follow the links on the index page to see the
others.

        http://www.obrienresources.com/ga/index.html

What I'm looking for is a way to fix these half-dozen pages. Although I
understand basic HTML tagging, I'd never describe myself as a "coder."
I've tried grouping the objects first, aligning the grid to Default
horizontal position rather than Center, and so on, but to no avail.
What am I missing here? Do they all need to start from CSS template
pages and objects? (The documentation says this is recommended for
"liquid layouts" but otherwise optional. I thought my site didn't need
CSS bells and whistles.) Ideas?

---

Request for Question Clarification by leapinglizard-ga on 08 Jun 2005 00:47 PDT

Yes, you need CSS. That doesn't mean bells and whistles, it just means
designing the web page in a coherent way using universal web
standards. The problem with GoLive is that it's generating
non-standard HTML based on dirty table tricks -- notice all the
fixed-width spacers -- that only IE renders in the way you intended.
Only IE works because the lousy GoLive back end is targeted only at
IE, and probably only at certain versions of IE. A clean, table-free,
CSS-based design would work much better on a wide variety of browsers.

I'm not sure how I can help you at this point. Do you want pointers to
instructional materials on CSS, or a sample layout for one of your
pages to use as an example, or what?

leapinglizard

---

Clarification of Question by danob-ga on 08 Jun 2005 06:28 PDT

leapinglizard -

Thanks for the input -- I didn't realize that GoLive's HTML and
Firefox weren't on friendly terms...

I'd like to take you up on your offer to re-do one of my pages to be
CSS-compliant, along with instructions to copy/migrate/template-ize
that basic layout for re-use on the other pages. Can you do that for
the fee?

I'm looking forward to seeing what you come up with, and I'll use this
as an entry into CSS know-how.

danob

FireFox does not render CSS in it's entirety. It simply isn't finished
being coded, was overlooked or has been postponed.

As for CSS2, The new version of IE to be released this summer wont
even be supporting it by it's release date.

The more you code and the more tricks you learn and want to try out in
your web pages, the more you will see that FireFox simply does not
have the capacity to correctly render many things if it can render
them at all. And the more greatful you'll be that IE is installed by
default on every Windows system.

The fault is not with your code or GoLive, but FireFox. In FireFox's
defence though, Microsoft has well over 10 years and hundreds of
millions of dollars dumped into the technology.

Hey,
I read your problem, and the answers dealing with CSS. While CSS is an
awesome tool for web design, there's a much simpler solution. I've had
these problems with GoLive (and Dreamweaver) before, so here's some
words of wisom:

Tables. Your tables are too complicated, with many cells combined and
split. FireFox is seeing these combined tables in their original
configuration as many cells, and thus stretching your site all out of
whack.

The quick solution: simplify the tables. I re-did one of your pages in
a simplier table, which I tested one of my servers, and it
looked the same in both FireFox and Safari. Check it out and and save
as from: (ignore the badly copied images):

http://video.resa.net/google3.html

(I'll take it down once you've got the file)

A few things to note; images and text can share the same cell (see the
left colum) just put a line break ( <br> ) in the code after each
image. There's two <br>'s inbetween the ball circle image and the
text.

Check out how the stacked images and text work in the file, as well as
alignments.

Another way to really cheat tables is to make 'blank' images the same
color as your background, the same height or width you want a blank
space to be, and stick them where you want the space.  I did not do
this in the file I'm sending, but be aware it's possible.

I kept your original image names in the file so you should be able to
work with it right away. Hope this helps.

Have a good one,
Melt