X-Cart forums - Internet Explorer centering everything

X-Cart forums (https://forum.x-cart.com/index.php)

- Changing design (https://forum.x-cart.com/forumdisplay.php?f=51)

- - Internet Explorer centering everything (https://forum.x-cart.com/showthread.php?t=33512)

OpheliaPayne

08-27-2007 11:45 AM

Internet Explorer centering everything

I hate IE.

I just took a peek at our site in IE. Everything is centered; menus, search, etc. We are using the default template. Is there an easy cure to fix this?

balinor

08-27-2007 05:02 PM

Re: Internet Explorer centering everything

Which default template? Light and Lucid? And IE6 or IE7? URL?

OpheliaPayne

08-27-2007 05:09 PM

Re: Internet Explorer centering everything

Sorry.

IE6.

I don't remember which template that I installed... how do I find that out?

And the store isn't open yet, so can't give out the URL.

balinor

08-27-2007 06:11 PM

Re: Internet Explorer centering everything

Tough to help unless we can see the code and a live example :(

OpheliaPayne

08-28-2007 06:25 AM

Re: Internet Explorer centering everything

Sorry, figured this was a known issue. I deal with it when the site is live.

OpheliaPayne

09-03-2007 05:41 PM

Re: Internet Explorer centering everything

We are live now. You can view the site here. IE6 I'm seeing the issue in. Thank you.

balinor

09-03-2007 05:46 PM

Re: Internet Explorer centering everything

View the source...you have a <center> tag (which is a depreciated tag by the way) just after the body tag, and then you attempted to close it within a table cell, which won't work. Get rid of the center tag and use an inline tag to center the main containing table:

<table class="Container" cellpadding="0" cellspacing="0" width="90%" align="center">

Victoria Feemster

09-04-2007 12:10 AM

Re: Internet Explorer centering everything

I am having the same issue but I am confused about what I need to edit and where.

balinor

09-04-2007 04:13 AM

Re: Internet Explorer centering everything

Need to see a url in order to figure out what your issue is, as it may not be the same as the above.

Victoria Feemster

09-04-2007 04:34 AM

Re: Internet Explorer centering everything

Sorry about that.

http://www.oneofakindscrapz.com/store/home.php

balinor

09-04-2007 04:45 AM

Re: Internet Explorer centering everything

Your problem is different and actually more serious. You have this code AFTER your main <body> code:

<body OnLoad="na_preload_img(false, 'http://www.oneofakindscrapz.com/images/logo/logo2a.jpg', 'http://www.oneofakindscrapz.com/images/logo/logo3a.jpg', 'http://www.oneofakindscrapz.com/images/logo/logo4a.jpg', 'http://www.oneofakindscrapz.com/images/logo/logo5a.jpg', 'http://www.oneofakindscrapz.com/images/logo/logo6a.jpg', 'http://www.oneofakindscrapz.com/images/logo/logo7a.jpg');">
<div align="center">

You can only have one <body> tag, so you need to remove the one from wherever you added it that shows the above code. Also, get rid of that div tag with the center align to fix the centering problem.

Victoria Feemster

09-04-2007 04:51 AM

Re: Internet Explorer centering everything

ok now is this edited on the skin1.css? I think that above code is my header? I didn't do this design on my site so I am not really familiar with the code. I Just know that it being centered is annoying me.

balinor

09-04-2007 04:54 AM

Re: Internet Explorer centering everything

You should contact your designer to see where that code was placed. You have 101 validation errors on your site, so your designer should be fixing those.

Victoria Feemster

09-04-2007 04:55 AM

Re: Internet Explorer centering everything

What is a validation error?

balinor

09-04-2007 04:58 AM

Re: Internet Explorer centering everything

It means the code was not written to the current web standards, which will cause display issues in different browsers. You can read more about validation/web standards here:

http://www.w3.org

X-Cart validates by default, so it is the code your designer added that doesn't adhere to the standards.

Victoria Feemster

09-04-2007 05:02 AM

Re: Internet Explorer centering everything

Thank you. I will get with her

balinor

09-04-2007 05:04 AM

Re: Internet Explorer centering everything

Be prepared for a 'Oh we don't need to do that' response. Many developers don't care about writing W3C compliant sites, which is a mistake in my opinion. The <body> issue definitely needs to be taken care of though.

OpheliaPayne

09-04-2007 05:18 PM

Re: Internet Explorer centering everything

Quote:

Originally Posted by balinor

Hello.

I changed this

Code:

{* $Id: rectangle_top.tpl,v 1.25 2006/02/07 08:09:51 max Exp $ *}

  <center>

<table class="Container" cellpadding="0" cellspacing="0" width="{$width|default:"90%"}">

<tr><td class="Container">  </center>

to this

Code:

{* $Id: rectangle_top.tpl,v 1.25 2006/02/07 08:09:51 max Exp $ *}

  <center>

<table class="Container" cellpadding="0" cellspacing="0" width="{$width|default:"90%" align="center"}">

<tr><td class="Container">  </center>

It does fix the issues of the tables being centered, however it creates a new issue where the the store is left aligned now instead of centered in the middle of the page. Since our site is centered in the middle of the page at 90%, we obviously can't have the store left aligned :) Any ideas on how to fix that?

balinor

09-04-2007 05:28 PM

Re: Internet Explorer centering everything

You have the center inside the smarty width tag. Use this:

<table class="Container" cellpadding="0" cellspacing="0" width="90%" align="center">
<tr><td class="Container">

Get rid of those <center> tags! :)

carpeperdiem

09-04-2007 05:48 PM

Re: Internet Explorer centering everything

Here's my favorite centering trick:

in your css file, try this:

TABLE.Container { width: 900px; margin-left: auto; margin-right: auto; background-color: #FFFFFF; }

margin-left: auto;
margin-right: auto;

is the secret.

better than center!

balinor

09-04-2007 05:51 PM

Re: Internet Explorer centering everything

True, and if you want it even cleaner, use CSS:

.Container (margin: 0 auto;}

OpheliaPayne

09-04-2007 05:53 PM

Re: Internet Explorer centering everything

Balinor,

I pasted the wrong code. Sorry about that. Lets try this again.

I changed this...

Code:

{* $Id: rectangle_top.tpl,v 1.25 2006/02/07 08:09:51 max Exp $ *}

  <center>

<table class="Container" cellpadding="0" cellspacing="0" width="{$width|default:"90%"}">

<tr><td class="Container">  </center>

to this:

Code:

{* $Id: rectangle_top.tpl,v 1.25 2006/02/07 08:09:51 max Exp $ *}

<table class="Container" cellpadding="0" cellspacing="0" width="{$width|default:"90%" align="center}">

<tr><td class="Container">

Victoria Feemster

09-04-2007 06:39 PM

Re: Internet Explorer centering everything

OpheliaPayne,

On your site, I see the text in the sideboxes as centered but your logo as right aligned on IE.

somekindahate

09-04-2007 07:25 PM

Re: Internet Explorer centering everything

OphelliaPayne,

Your solution of removing the <center> tag and using align="center" is not correct. And like others have stated, you should be using CSS to fix this problem, not deprecated HTML. Remove the align attribute and the center tags you've added.

Go to skin1/customer/main/home.tpl

After the <body> tag add <div id="envelope">
Before the closing </body> tag add </div>

Add the following to your CSS file skin1.css

Code:

body {

   text-align: center;

}

#envelope {

   text-align: left;

   margin: 0 auto;

}

When you view the source, there should be a <div id="envelope"> ... </div> wrapping the contents of the page just inside of the body tag.

OpheliaPayne

09-04-2007 08:17 PM

Re: Internet Explorer centering everything

Quote:

Originally Posted by somekindahate

Code:

body {

   text-align: center;

}

#envelope {

   text-align: left;

   margin: 0 auto;

}

When you view the source, there should be a <div id="envelope"> ... </div> wrapping the contents of the page just inside of the body tag.

This did not work.

Quote:

TABLE.Container { width: 900px; margin-left: auto; margin-right: auto; background-color: #FFFFFF; }

margin-left: auto;
margin-right: auto;

This did work. Thank you. :)

All times are GMT -8. The time now is 10:58 AM.