f



Javascript problem?

Hello,

I have a small javascript on page that seems to affect the spacing 
further down on the page. That is, I have a large space between two 
unrelated HTML sections and when I remove the script, the space goes 
away. The page does validate with or without the script.

You can see this on a test page at 
http://www.usernomics.com/ergonomic-products-data%20NEW.html . Note 
the space between the red text and the first table. The javascript is 
below.

Can anyone see what might be causing the problem?

Thanks,

Bob


The section containing the javascript looks like this:

<div class="centerall"><a 
href="http://www.usernomics.com/ergonomics-store.html" 
title="Ergonomic Products Sale">Ergonomic Products Sale</a><br> <div 
class="centerallsmall">Keyboards, Mice, Desks, Chairs, Household</div>

<script type="text/javascript"><!--
amazon_ad_tag="usernomics-20";
amazon_ad_width="120";
amazon_ad_height="240";
amazon_color_border="999999";
amazon_color_logo="FFCE2C";
amazon_color_link="33578B";
amazon_ad_logo="hide";
amazon_ad_title="Ergonomic Product Store"; //--></script>
<script type="text/javascript" 
src="http://www.assoc-amazon.com/s/asw.js"></script>
</div> 


0
Hymer
7/10/2007 3:59:53 PM
comp.authoring.html 7078 articles. 0 followers. Post Follow

12 Replies
672 Views

Similar Articles

[PageSpeed] 41

Hymer wrote:
> 
> http://www.usernomics.com/ergonomic-products-data%20NEW.html . Note 
> the space between the red text and the first table.

FYI, I see no extra space, just normal line spacing. No difference with
JavaScript enabled or disabled, either.

-- 
Berg
0
Bergamot
7/10/2007 4:32:59 PM
Hymer wrote:
> 
> You can see this on a test page at 
> http://www.usernomics.com/ergonomic-products-data%20NEW.html . Note 
> the space between the red text and the first table. 

Like Berg, I detect no difference using FF.

-- 
John
0
John
7/10/2007 4:43:05 PM
"John Hosking" <John@DELETE.Hosking.name.INVALID> wrote in message 
news:4693b73a_6@news.bluewin.ch...
> Hymer wrote:
>>
>> You can see this on a test page at 
>> http://www.usernomics.com/ergonomic-products-data%20NEW.html . Note 
>> the space between the red text and the first table.
>
> Like Berg, I detect no difference using FF.


Hi Guys,

Yup, I see that now. It is fine in Firefox and Opera. The spacing 
problem occurs in IE only. It is a very large space - 3 or 4 inches 
below the red text.

Would you take a look in IE? If you do see it in IE, can you see the 
problem?

Thanks,

Bob 


0
Hymer
7/10/2007 5:03:40 PM
Hymer wrote:

> I have a small javascript on page that seems to affect the spacing
> further down on the page. That is, I have a large space between two
> unrelated HTML sections and when I remove the script, the space goes
> away. The page does validate with or without the script.
> 
> You can see this on a test page at
> http://www.usernomics.com/ergonomic-products-data%20NEW.html
> . Note the space between the red text and the first table. The
> javascript is below.
> 
> Can anyone see what might be causing the problem?

Here is what I see in the space you mention:

Not Found

The requested 
URL /e/cm was not 
found on this server.
-------------------
Apache/2.0.59 
(Win32) PHP/5.2.0 
Server at speedy 
Port 80

The reason is "rcm.amazon.com" is in my HOSTS file.

...called by this:
  src="http://www.assoc-amazon.com/s/asw.js"></script>

("speedy" is my computer)

Now, all that said, I too see no difference in Fx 2 or IE 6 (or Opera),
when the amazon link is removed from the HOSTS file.

-- 
   -bts
   -Motorcycles defy gravity; cars just suck
0
Beauregard
7/10/2007 5:59:26 PM
Well bust mah britches and call me cheeky, on Tue, 10 Jul 2007 15:59:53 GMT 
Hymer scribed:

> Hello,
> 
> I have a small javascript on page that seems to affect the spacing 
> further down on the page. That is, I have a large space between two 
> unrelated HTML sections and when I remove the script, the space goes 
> away. The page does validate with or without the script.
> 
> You can see this on a test page at 
> http://www.usernomics.com/ergonomic-products-data%20NEW.html . Note 
> the space between the red text and the first table. The javascript is 
> below.
> 
> Can anyone see what might be causing the problem?

I notice that the "space" ends where the ads in the right column end.

-- 
Neredbojias
A self-made man who worships his creator
0
Neredbojias
7/10/2007 6:07:33 PM
Hymer wrote:
> "John Hosking" <John@DELETE.Hosking.name.INVALID> wrote in message 
> news:4693b73a_6@news.bluewin.ch...
>> Hymer wrote:
>>> You can see this on a test page at 
>>> http://www.usernomics.com/ergonomic-products-data%20NEW.html . Note 
>>> the space between the red text and the first table.
>> Like Berg, I detect no difference using FF.
> 
> 
> Hi Guys,
> 
> Yup, I see that now. It is fine in Firefox and Opera. The spacing 
> problem occurs in IE only. It is a very large space - 3 or 4 inches 
> below the red text.
> 
> Would you take a look in IE? If you do see it in IE, can you see the 
> problem?

Seen in IE6: the white background connecting the red "Please Note" text 
with the list of suppliers (coded, however, as a sequence of <table 
class="products"> elements) is missing on page load. It reappears, 
however, if I flip to another window and then back or change text size.

I suspect but cannot verify that this is the IE6 Peekaboo Bug. See 
http://www.positioniseverything.net/explorer/peekaboo.html if you don't 
know this bug. I'm sorry that I can't be more helpful but your CSS is 
rather convoluted and so I leave the verification and solution to you.

I would suggest a revision of your markup and styling system. You've 
overstyled (IMO) your page by using markup like
   <p class="centernospace">Companies</p>
instead of, say,
   <h4>Companies</h4>
and then your CSS is overloaded with extra-specific style rules. Your 
class naming is also weak (again, IMHO), as exemplified by this rule:

..centerquoteofday{                      /* Quote of the Day BODY*/
	text-align:left;
	font-style: italic;
	font-size: 110%;
	line-height: 125%;
	font-family:times new roman, times;
	padding: 0px 0px 10px 0px;
	}

Use, if you wish, .quoteoftheday, and then style it the way you want the 
quote of the day styled, be it left, centered, right, green, whatever. 
IOW, take the putative styled attributes out of the class names and 
leave the semantic or functional name; put the styling in the rule 
definitions where they belong (and can be easily changed). The 
simplification can be helpful to your further code maintenance.

I also see: <br /><br /><br />. Unrelated to the above, but eeuwww 
(especially in an HTML page).

HTH.

-- 
John
Pondering the value of the UIP: http://blinkynet.net/comp/uip5.html
0
John
7/10/2007 6:39:14 PM
>> I have a small javascript on page that seems to affect the spacing
>> further down on the page. That is, I have a large space between two
>> unrelated HTML sections and when I remove the script, the space 
>> goes
>> away. The page does validate with or without the script.
>>
>> You can see this on a test page at
>> http://www.usernomics.com/ergonomic-products-data%20NEW.html
>> . Note the space between the red text and the first table. The
>> javascript is below.
>>
>> Can anyone see what might be causing the problem?
>
> Here is what I see in the space you mention:
>
> Not Found
>
> The requested
> URL /e/cm was not
> found on this server.
> -------------------
> Apache/2.0.59
> (Win32) PHP/5.2.0
> Server at speedy
> Port 80
>
> The reason is "rcm.amazon.com" is in my HOSTS file.
>
> ..called by this:
>  src="http://www.assoc-amazon.com/s/asw.js"></script>
>
> ("speedy" is my computer)
>
> Now, all that said, I too see no difference in Fx 2 or IE 6 (or 
> Opera),
> when the amazon link is removed from the HOSTS file.


I am not quite understanding this. What is the HOSTS file?

I cleared my cache and temp files but I still see a big space after 
the red text in IE6. It does appear to be in line with the ads on the 
sidebar.  Are you seeing the space?

Sorry to be so dense. I gather that I have the "rcm.amazon.com" in my 
HOSTS file and that is causing the space? Will others see the space or 
is it only if you have that file?

Bob 


0
Hymer
7/10/2007 6:49:56 PM
"Hymer" <ergobob@sonic[REMOVE].net> wrote:

>Yup, I see that now. It is fine in Firefox and Opera. The spacing 
>problem occurs in IE only. It is a very large space - 3 or 4 inches 
>below the red text.
>
>Would you take a look in IE? If you do see it in IE, can you see the 
>problem?

I don't see an immediate cause, but I see another difference: in MSIE,
the right border column, below the images, is white, not the gray
stripes you see in Firefox.

-- 
	Bart.
0
Bart
7/10/2007 7:12:21 PM
>>
>> Hi Guys,
>>
>> Yup, I see that now. It is fine in Firefox and Opera. The spacing 
>> problem occurs in IE only. It is a very large space - 3 or 4 inches 
>> below the red text.
>>
>> Would you take a look in IE? If you do see it in IE, can you see 
>> the problem?
>
> Seen in IE6: the white background connecting the red "Please Note" 
> text with the list of suppliers (coded, however, as a sequence of 
> <table class="products"> elements) is missing on page load. It 
> reappears, however, if I flip to another window and then back or 
> change text size.
>
> I suspect but cannot verify that this is the IE6 Peekaboo Bug. See 
> http://www.positioniseverything.net/explorer/peekaboo.html if you 
> don't know this bug. I'm sorry that I can't be more helpful but your 
> CSS is rather convoluted and so I leave the verification and 
> solution to you.
>
> I would suggest a revision of your markup and styling system. You've 
> overstyled (IMO) your page by using markup like
>   <p class="centernospace">Companies</p>
> instead of, say,
>   <h4>Companies</h4>
> and then your CSS is overloaded with extra-specific style rules. 
> Your class naming is also weak (again, IMHO), as exemplified by this 
> rule:
>
> .centerquoteofday{                      /* Quote of the Day BODY*/
> text-align:left;
> font-style: italic;
> font-size: 110%;
> line-height: 125%;
> font-family:times new roman, times;
> padding: 0px 0px 10px 0px;
> }
>
> Use, if you wish, .quoteoftheday, and then style it the way you want 
> the quote of the day styled, be it left, centered, right, green, 
> whatever. IOW, take the putative styled attributes out of the class 
> names and leave the semantic or functional name; put the styling in 
> the rule definitions where they belong (and can be easily changed). 
> The simplification can be helpful to your further code maintenance.
>
> I also see: <br /><br /><br />. Unrelated to the above, but eeuwww 
> (especially in an HTML page).
>

Thanks John,

Yes, I see what you mean about the CSS. I will clean it up as you 
suggested. I am just learning CSS as you can tell.

I also noticed that if I change the text size, the larger the text the 
less the space. I read the peekaboo page and it does look like that 
problem.

Does anyone how I might apply a fix to my CSS for this problem?

Thanks,

Bob 


0
Hymer
7/10/2007 7:49:20 PM
Hymer wrote:

> I am not quite understanding this. What is the HOSTS file?

http://www.mvps.org/winhelp2002/hosts.htm

> I cleared my cache and temp files but I still see a big space after
> the red text in IE6. It does appear to be in line with the ads on the
> sidebar.  Are you seeing the space? 

No.  Regardless of the state of my own HOSTS file. I don't see your
described space in Fx, IE6, Opera.  If this is only a few pixels, it's
probably the three-pixel bug in IE. Since pixel-perfect display across
many browsers is nigh onto impossible, I wouldn't worry about it. <g>

> Sorry to be so dense. I gather that I have the "rcm.amazon.com" in my
> HOSTS file and that is causing the space? Will others see the space
> or is it only if you have that file?

If you didn't know what a HOSTS file was, chances are you do not have
the amazon name in it. If you actually see the amazon image and ad, you
definitely do not.

-- 
   -bts
   -Motorcycles defy gravity; cars just suck
0
Beauregard
7/10/2007 7:50:16 PM
Neredbojias wrote:
> Well bust mah britches and call me cheeky, on Tue, 10 Jul 2007 15:59:53 GMT 
> Hymer scribed:
> 
>> http://www.usernomics.com/ergonomic-products-data%20NEW.html . Note 
>> the space between the red text and the first table.
> 
> I notice that the "space" ends where the ads in the right column end.

Yup, looks like IE is making the table clear the last element in the
right column for some unknown reason. It has no logic where floats and
widths are concerned, anyway, especially things set in %.

In main.css:
table.products{
  margin-bottom: 25px;
  width: 100%;
}

Change width to 99% and the weird spacing goes away, though it can
probably be dropped altogether.

-- 
Berg
0
Bergamot
7/10/2007 8:08:04 PM
>>> http://www.usernomics.com/ergonomic-products-data%20NEW.html . 
>>> Note
>>> the space between the red text and the first table.
>>
>> I notice that the "space" ends where the ads in the right column 
>> end.
>
> Yup, looks like IE is making the table clear the last element in the
> right column for some unknown reason. It has no logic where floats 
> and
> widths are concerned, anyway, especially things set in %.
>
> In main.css:
> table.products{
>  margin-bottom: 25px;
>  width: 100%;
> }
>
> Change width to 99% and the weird spacing goes away, though it can
> probably be dropped altogether.
>


Thanks so much Berg. I changed the width to 99% and all is well. It is 
so easy when you know what you are doing. Much appreciated.

Bob 


0
Hymer
7/11/2007 12:49:33 AM
Reply: