PC/Mac Display Differently - Please look?

[Jazz]

I'm working on a page that looks just dandy to me on my Mac (NS4.61 and IE4.5), but the customer says some stuff isn't lining up correctly when viewed on their PCs. They're using IE 5, and I don't think they've checked it out in NS.

As I have no PC to check this on (yet!), would any of you be able to check the page and let me know what you're seeing?

This is it's temporary home: http://www.bluehillsdesign.com/streamfeeder/index.htm

My main concern is the stuff all along the left side. The logo, gray bar, stack of blue navigation graphics, and "Product Jump" are all supposed to be centered on each other. The blue navigation graphics and the Product Jump thing are supposed to have a black background of about 3/8 or 1/4 inch (i.e., td bgcolor="#000000")

(BTW, I asked some time back about how to make the left margin of the page be at least 20 pixels, and with several people's help I accomplished that---in IE and on PCs, anyway. So if you look at this page in NS and it's got no whitespace on the left, ferggeddabouddit---I'm not caring anymore. The client is seeing what he wants to see, and that's just fine with me. :P)

Thank you ever so much; it's about quittin time, isn't it? Time for some adult malt beverages, if you ask me!

Jazz

[Dan Kaplan]

Hey Jazz,

It looks the way you described for me on a PC with NS 4.5.[nbsp][nbsp]The grey "steamfeeder.com" box lines up with the others but doesn't have the black background -- it sits right above the black.[nbsp][nbsp]Is this what you intended?

So if you look at this page in NS and it's got no whitespace on the left, ferggeddabouddit---I'm not caring anymore. Uh-oh, I don't want to be the bearer of bad news...[nbsp][nbsp]I think marginwidth="0" marginheight="0" might be the problem.

Duck!

[Jazz]

Dan (No need to duck, for Pete's sake!)

The gray "streamfeeder.com" box (first thing under the logo) does NOT have black in that td bgcolor---it's supposed to sit above the black, so that's OK.

So do you mean that the rest of it seems to be doing what I want it to do in NS? (If you figured out what I meant by my lengthy explanation up top there, I really appreciate your patience...! :) ) Are you able to look at it in IE???

So what should I have for margins? I'm all confused. I want the top blue bar to snug right up to the very top, and the left side to have whitespace of about 20 or so. It seems to work in Mac IE 4.5, but not in Mac NS.

Appreciate it! (My husband will be home soon with his PC laptop, so I'll be able to check it then, but the more eyes--who know how to read code--the better!)

Jazz (I absolutely should change my name. I haven't found any decent "J" words to use.)
[This message has been edited by Jazz (edited 01-28-00@6:36 pm)]

[Justin]

Since I can't tell exactly what it is supposed to look like from your description:

http://www.vdj.net/bluehill.jpg (114 kb)

I'll leave it up for a couple days - screenshot using Win98/IE 5.1

Hope this helps.

Jpeg

------------------
Justin Nelson
FutureQuest Support
[This message has been edited by Justin (edited 01-28-00@7:02 pm)]

[wolfstalks]

Well, I have looked at the page , and in NS 4.7 on a PC running Win2000 it looks great, but I also looked at Justin's screen shot and I noticed that I have to scroll sideways to see the whole page???[nbsp][nbsp]Are you sure that you and your client aren't having a screen size/resolution difference.[nbsp][nbsp]I have had some clients still using 14" screens and 640 X 480 and have had to try to compromise the web page so that it looked as good as possible in many resolutions and screen sizes????

Anyway that's my 1 1/2 cents worth ( why is there not a cent option available on the keyboard when there is a $ option???)

------------------
Have a Good One
Bob

[Dan Kaplan]

Hmm, Justin's screen shot looks much different than what I see with Netscape.[nbsp][nbsp]I see the items centered on the black background, but without the white left-side border.[nbsp][nbsp]I would guess that the two items (white border and black box) are interfering with eachother somehow.

I'm assuming I understood correctly what you described, or did I get it all backward...?

Dyslexic

[Jazz]

Cripes, it's been such a long time since I did a screen shot, I can't remember what the dang key combination is. Give me a sec, and I'll show you what it's supposed to look like (like I said, it works as intended on Mac IE4.5)

Justin's screen shot seems to show what my client is seeing. Dan seems to be seeing it the way I mean for it to be seen--- in NS, anyway; unless someone can tell me how to give it whitespace on the left... It's mostly IE I'm having trouble with.

Bob---I think that Justin must have a super-monitor or the screen shot just looks particularly large, because I've actually specifically designed the page/site to be a little bit "elastic." The client has decided that his customers have decent computers with 19" monitors and 800 x 600 resolution, and, irresponsible or not, I stopped arguing with him.

Oh! I'll get those screen shots! Be back in a few!

Jazz (I'm totally giving up on J's. Justin, you can have them!)
[This message has been edited by Jazz (edited 01-28-00@7:51 pm)]

[Jazz]

The consensus so far seems to be that NS is displaying it OK, but IE is where my trouble is. I really need some IE opinions...!

Here's a (lousy GIF of a) screen shot of how it looks in Mac IE. This is the way it's supposed to look. http://www.bluehillsdesign.com/FQuest/sfie.gif

Here's another (lousy GIF of a) screen shot of how it looks in Mac NS. This is also the way it's supposed to look. http://www.bluehillsdesign.com/FQuest/sfns.gif (Both of my screen shots cut the bottom off; that's OK.

Can anyone look at my source and see where I've gone wrong, IE-wise? And unfortunately, I've kluge'd this file so much today, my code probably looks terrible... And I'm using Dreamweaver, for the most part. (A bit of an embarrassed sigh...)

Thanks ever so much!
Jazz (Partaking of an adult malt beverage as we speak.)

[Dan Kaplan]

I'm totally giving up on J's. Justin, you can have them! Twas only a matter of time till the best letter emerged victorious![nbsp][nbsp]:)

Try changing:
topmargin="0" leftmargin="20" rightmargin="0" marginwidth="0" marginheight="0"
to:
topmargin="0" leftmargin="20" rightmargin="0" marginheight="0"

My guess is that marginwidth="0" is overwriting leftmargin="20".[nbsp][nbsp]Of course, that doesn't address the problem with IE not centering the black section.[nbsp][nbsp]That's odd, usually things line up ok in IE, but Netscape is the picky one...

Man, I gotta slow down.[nbsp][nbsp]It's only a matter of time until I run out of quality sign-offs.[nbsp][nbsp]I might have to break down... and consult the...

Dictionary!

p.s. Anyone know what "dyslexia" is an anagram for?[nbsp][nbsp];)[nbsp]

[Justin]

Looking at the source, I am seeing a few things that don't seem right:

<td width=&quot;15&quot; align=&quot;left&quot; bgcolor=&quot;#000099&quot;><img src=&quot;graphics/cmngrfcs/topbar2.gif&quot; width=&quot;185&quot; height=&quot;50&quot; vspace=&quot;0&quot; hspace=&quot;0&quot; alt=&quot;612.502.0000&quot;></td>

Note that you are specifying the <TD> width to 15, but placing an image that is 185 pixels wide inside of that <TD>... I am seeing a lot of this throughout the code...

I also see <tr align=center> - TR's are rows, there is no alignment...

All in all, I'm seeing a lot of <TD>'s that are set to be smaller than the content inside of them, which is asking for trouble all the way around - none of the browsers handle poor code (no offence intended at all) the same way - they all will find their own way of rendering the code...

I get the feeling that this was created with an HTML generator (most people do not hand code <!DOCTYPE HTML PUBLIC &quot;-//W3C//DTD HTML 3.2//EN&quot;> in their pages) - if so, what program is it? It is perfectly understandable for a human to make errors when coding HTML (TD widths and so on) but it would be unacceptable for an HTML program to do this...

What I would suggest is to clean the code up the best you can, and use pixel sizes throughout rather than percentages (I see some spots where you are mixing % and pixels - another no-no)...

I hope this helps - again, no offense intended by my observations.

------------------
Justin Nelson
FutureQuest Support

[Jazz]

(Oops...submitted twice, and page-split to boot. Next post is the real deal.)
[This message has been edited by Jazz (edited 01-29-00@12:06 pm)]

[Jazz]

No offense taken, Justin! I'm using Dreamweaver for the most part, and the lousy kluges aren't the application's problem; they're mine...I'm totally aware of that, and embarrassed besides. I was going to ask sometime earlier whether mixing percentages and pixels widths in tables were horrible form, but I guess I knew the answer already...

The client wants the page (site) to be a little bit elastic. Stretch it out a bit on a larger monitor, and it accommodates it a bit. A smaller monitor size/resolution---make it look sorta OK in that, too. The left-hand column kept stretching out too wide, so I wrung my hands and forced it to be smaller than the graphics. For the most part, I think it helped, even though it's bad form.

But the centering problem in the left-hand column? That's the main deal here.
I also see <tr align=center> - TR's are rows, there is no alignment... (Like I said, I was trying ANYthing to make this thing center!)
I promise to mend my horrible coding ways in the future, if someone can figure out what my problem is with centering that &quot;column-from-heck&quot; on the left...!!!!

To reiterate---don't blame Dreamweaver for my bad coding here...I'm just getting frustrated with this page (and the subsequent pages that I have to apply this format to, and the client who doesn't realize that HTML coding can't be manipulated like desktop publishing page layout [that's his background], and.........!) :(

Thanks everyone, for your continued help...Dan---I'll try that margin advice you contributed once I get some sleep and regroup for the fight with this dang page....

Jazz (Hah! To make Dan go to the dictionary for D words? Don't tease me! If Somebody with an S-name started doing this, you'd be put to shame! Or tedloh! Or Tatu!)
[This message has been edited by Jazz (edited 01-29-00@12:02 pm)]