[Solved]: center coppermine in browser: IE7 vs. FireFox

joost · July 04, 2008, 02:06:57 PM

Sample of problem: site
Theme: eyeball (tried other themes as well)
In the template file I packed everything between <body> </body> in a div called "wrapper"
in my style.css I have
div#wrapper{
    margin: auto;
   width: 950px;
   border: medium fuchsia double;
   }
This works on most everything I do to center the div within the browser (horizontal), but ONLY when using coppermine and only in IE explorer the div settles to the left of the screen.

I have tried a lot of things, but I am tempted to think that somewhere in coppermine something is called that undoes the 'auto' parameter in div#wrapper. If I previes the same screen with PHP turned of (i.e. in a local browser), it centers also in IE, but coming from the server it doesn't.

Hope someone has any ideas!?

steveeh131047 · July 04, 2008, 02:39:49 PM

Have you checked whether IE is in Standards mode or Quirks mode?

IE7 in Quirks mode, and all earlier versions of IE, ignore the margin: auto styling. If you want to be compatible with the earlier versions of IE you need an "outside wrapper" Div which contains text-align: center, and then override this with text-align: left in your inner wrapper Div. For some reason best known to Microsoft, the text-align: center styling will centre "offspring Divs" as well as text.

steveeh131047 · July 04, 2008, 02:50:30 PM

Joost,

Just checked your page - as I thought, it's forcing IE into its "backwards compatible" Quirks mode, which ignores the Auto attribute on Margin styling. Either do what I said with an outer Div, or find out what's forcing IE7 into Quirks.

joost · July 04, 2008, 03:23:40 PM

Hello Steve,

Just ran away from my computer (I am at my real job now), but as soon as I get back I will try your suggestion. The thing I don't get is that the rest of the site does not show this behavior. First I incorporated the look and feel of the side into this template, but now I am using a barely modified standard theme. Tried different computers just to make sure....

The sad part is, I have one site doing this just fine, but I can't remember doing anything special to make that work: this site.

Anyway, I will post my findings. Possiby your hack works and then I am not going to worry about it anymore . . . won't be to long and we have to deal wit IE8.x

Thanks so far,
Joost

steveeh131047 · July 04, 2008, 03:39:29 PM

Joost,

Look carefully for any differences in the Document Type Declaration and any XML declarations - those are the things the Browsers use to determine what mode to go into.

But the "hack" of the extra outer Div would be needed anyway if you want the site to look right in IE6 and earlier.

Cheers,
Steve

steveeh131047 · July 04, 2008, 03:45:44 PM

Joost,

In case it helps, here's a good reference for the effects of the various DTDs:

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

Steve

Hein Traag · July 04, 2008, 03:48:42 PM

You are aware that the xfoto site is running on a 9 versions old cpg.. 
The current stable is 1.4.18

joost · July 04, 2008, 04:10:36 PM

I couldn't wait and did a remote session to my house and....the hack works. (And I thought I knew a thing or two....)

I will look into all the other suggestions though, just to be sure. I did check and played around with the declarations but didn't see a problem, but, I will double check and compare the not working with the correctly displaying side. Thanks for the link to hsivonen.iki - I wasn't aware of it yet.

Anyway, this is one more lesson to use the forum a lot sooner next time - I stayed up til 04:00 AM playing around (but picked up a couple of things on the way, so it wasn't all that bad).

Thank you - thread can close as far as I am concerned.

steveeh131047 · July 04, 2008, 04:57:26 PM

Joost,

One thing to check is that the DTD is the very first thing served on the page. In Notepad I see and extra character on your "faulty" site ahead of the DTD which is not there on the "good site". Try taking it out.

Steve

joost · July 06, 2008, 01:39:37 PM

Hello Steve,

Thank you for pointing that out. Can't explain it though - even the themes that I didn't touch have that problem. I think I will do a complete reinstall and see what happens. Possibly one of the PHP files got messed up. I remember about two years ago there was some issue with the language files - if you had opened them and closed them with a space at the end of the file (or something along that line), you would run into some issues with the album that was really hard to trace.

I will post again when done.

Joost

joost · July 06, 2008, 03:14:51 PM

Just did a new setup and problem is gone. No more need for the hack and yes, the charachters that preceded the DTD caused the problem. So, somewhere I must have messed up a php file (or two), because a fresh install everything works as expected without needing the hack to center my page.

After all that I went back to my initial custom theme and the problem reappeared. After replacing the theme.php with a fresh copy everything is back to normal. Although I did take a real good look at the problem theme.php file I couldn't find any problem in it. Anyway, it is replaced now and problem is gone.

Thanks for all the input and help.

steveeh131047 · July 06, 2008, 08:41:19 PM

Joost,

Glad you've sorted it. But remember you need the hack if you want compatibility with earlier versions of IE.

coppermine-gallery.com/forum

News:

[Solved]: center coppermine in browser: IE7 vs. FireFox

joost

steveeh131047

steveeh131047

joost

steveeh131047

steveeh131047

Hein Traag

joost

steveeh131047

joost

joost

steveeh131047