HTMLHelp Forums > Help with IE/FF

HTMLHelp Forums > Web Authoring > Markup (HTML, XHTML, XML)

irok

Aug 3 2012, 09:55 AM

Can someone tell me why I can't get my code to line up the same in IE 8 and FF 12.
Here is what it looks like in IE 8:
Click to view attachment

And in FF 12:
Click to view attachment

The scroller (crawler) section (middle row) is too wide in FF.
The top and bottom tables line up, just not the center section.

Here is the Code:

CODE

thanks

pandy

Aug 3 2012, 09:58 AM

It would be a lot easier if you could link to the page so we can see the images.

irok

Aug 3 2012, 10:18 AM

You have to join our forum to see the images live, that's why I took a snap shot of them and placed the code here.
Is there something else you need off the page that would help?

pandy

Aug 3 2012, 11:50 AM

The base URL for the images.

irok

Aug 3 2012, 12:58 PM

QUOTE(pandy @ Aug 3 2012, 11:50 AM)

The base URL for the images.

Is this what you need?
http://i1075.photobucket.com/albums/w427/okmdclub/

pandy

Aug 3 2012, 01:12 PM

Yeah. But it wasn't enough. Doesn't look anything like your screen cap. Probably need the URL to the script and any style sheets too. Maybe the rest of the HTML.

irok

Aug 3 2012, 01:30 PM

QUOTE(pandy @ Aug 3 2012, 01:12 PM)

Yeah. But it wasn't enough. Doesn't look anything like your screen cap. Probably need the URL to the script and any style sheets too. Maybe the rest of the HTML.

Being that it's a Proboards forum I don't have access to their CSS if that needs to be altered.
But here is the whole HTML from the page, I'll attach it as a txt file:
Click to view attachment

pandy

Aug 3 2012, 04:23 PM

Yeah, that worked out of the box. Strange though. Fist I see the image scroller fine. When I reload the page I get the alt text.

Anyway, it looks the same as in FF in Iron too (same as Chrome), so I guess it's IE that gets it wrong. I'll see if I can figure out what's JS and what's CSS and what's HTML in this.

pandy

Aug 3 2012, 04:32 PM

Oh. I had accidentely disabled images in my browser. That's why they disappeared.

Anyway, I guessed right. There is no doctype so browsers will be in Quirks Mode. When I add a doctype that triggers Standards Mode IE displays the scroller wider, just as the other browsers.

I haven't searched for it, but somewhere you define a width for the scroller and the two bars above and below it. When in Quirks Mode IE doesn't understand the Standards way of defining 'width'. 'width' is only the width of the content. The width of any borders and padding is added to that. In Quirks IE sees 'width' as what you could call total width, that is including borders and padding.

The correct and easiest way to fix it is to add a doctype that triggers Standards Mode and recalculate the widths. If you run this forum on your own domain, that shouldn't be a problem. If it's a hosted forum you probably can't.

http://hsivonen.iki.fi/doctype/

irok

Aug 3 2012, 04:38 PM

QUOTE(pandy @ Aug 3 2012, 04:32 PM)

Oh. I had accidentely disabled images in my browser. That's why they disappeared.

Thanks for all you detective work etc, I appreciate it

No the forum is run on Proboards so I don't think there is anything I can do as I only have access to the header and footer section of the page.
Well as I said thanks for all you work.

pandy

Aug 3 2012, 04:53 PM

It is a way, I think, but it's ugly. Make the widthswhat works for FF et al. Then embed a CSS block and define widths that work for IE there. Hide the CSS from other browsers than IE with a conditional comment.

Note that CSS blocks should be in HEAD. But if this hasn't changed in later versions of IE it will accept if they are in BODY as well. Test if it does before you put too much work into it.

http://msdn.microsoft.com/en-us/library/ms537512.aspx

This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.