...

View Full Version : Site is shifting to the left in Firefox



Eco2020
01-23-2012, 03:57 PM
Hi Everyone,

My site, www.greencareersguide.com shifts to the left when you go off of the homepage. I have looked over the code but am totally baffled. Any and all help is totally appreciated.:(

Excavator
01-23-2012, 05:47 PM
Hello Eco2020,
This is caused by errors in your code. Even with 120+ errors on the home page, it is still in standards mode.
The testimonials page is being placed into quirks mode by errors in the code and cannot center.

The validator can show you the errrors, see the links about validation in my signature line.
When working with the validator, start at the top and work your way down the list. Many times, because of the cascading nature of the errors, fixing one error will fix others below it.

Eco2020
01-23-2012, 07:03 PM
I tried removing the testimonial from the top. Still no good.:confused:

I found two pages, one works, one doesn't. I can't figure out what is the difference between the two codes of some pages.

Here is one that works:

http://www.greencareersguide.com/Vocational-Educational-Training-Providers.html

and a bad one:

http://www.greencareersguide.com/Building-a-Green-Career-in-Mass-Transit.html

This is driving me nuts.

Eco2020
01-23-2012, 09:26 PM
I believe it is in one of the tables but cannot identify. grr

ARCLite Studio
01-24-2012, 12:10 PM
The reason that this page:
http://www.greencareersguide.com/Building-a-Green-Career-in-Mass-Transit.html

Is not centering is because of this CSS located in:
site-wide-4438814186._V142210490_.css

The BODY tag in that CSS stylesheet reads:

body {
margin-bottom: 0 !important;
margin-left: 8px !important;
margin-right: 8px !important;
margin-top: 0 !important;
}

Because it is last in the order in which you link to it in your HTML the style's named in it will take precedence over other CSS named styles with duplicate tags in other linked styles sheets. Thus it will ignore the attributes for the body tag set in gcg-main.css You can either.

1.) Remove the link to that stylesheet if its not needed for that page
2.) change margin-left and margin-right to AUTO in: site-wide-4438814186._V142210490_.css (Might break other pages)
3.) on the page that is not centering make the margin correction inline by adding the style to the body tag in the HTML, this should override the stylesheet links with matching attributes.


<body style="margin-left:auto; margin-right:auto;">

Eco2020
01-24-2012, 01:39 PM
Hi ARCLite,

I am not sure what you mean. I don't have a "site-wide-4438814186....css"

I do agree that the tables are doing something screwy. I am not sure what you mean on what to change, as I do not see it in my html or CSS. Unfortunately I am still stuck.

ARCLite Studio
01-24-2012, 02:14 PM
Ok, I dug a little deeper. Some part of the AMAZON advertising/image code is executing script that injects CSS code. In any case:

** I'm not sure what browser your using or what add-ons/plugins you have, but in any case if you can look at your webpage with "javascript" disabled, you will find that it aligns properly (Centers the page and content), just in case you wanted to see proof of whats causing your problem **

In so far as what to edit Locate this in your HTML:



</head>

<body >
<!--************************************************************************************************-->
<!-- The table width below, is for the COMPLETE table, not the individual cells. You can change it
to as low as 80%, if you prefer the narrower look. -->


Change it to this:



</head>

<body style="margin-left:auto; margin-right:auto;"><!-- This is the edit -->

<!-- The table width below, is for the COMPLETE table, not the individual cells. You can change it
to as low as 80%, if you prefer the narrower look. -->

Let me know if that works for you.

Eco2020
01-24-2012, 03:15 PM
Adding the margin CSS to the body tag didn't work, but I deleted the entire amazon ad script from the page and it is now working properly. The code was these few lines:

<script type="text/javascript" src="(URL removed)">
</script>
<noscript>
<img src="(URL removed)" alt="" />
</noscript>
That generated mouseover Amazon Link Enhancer ads.

Thanks for all of your help.

ARCLite Studio
01-24-2012, 03:23 PM
Glad to help.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum