As you can see, the image(s) are all pushed up in the upper-left corner of the page, below the header and sidebar.

This is an old site and it uses absolutely positioned div tags. So, I created a div and gave it an absolute position of top: 221px left:199px. That was to clear the header and sidebar. I then added the images as per the following:

So far, so good. Then I linked to the javascript files that came with the switcher. Suddenly the images shifted to the top left corner of the site.

I have tried adding margin and padding and tried removing the positioning and using margin and padding instead. No luck. I looked in the config file that came with the switcher and cannot see anything that would cause the images to shift position. I am guessing the javascript file is making the images switch position.

1 answer

The div holding the images needs to be inside another div, which can be positioned at will. For whatever reason, this code seems to work:

<div id="imageSwitcher">
<div id="varal" class="imgsw">
<img src="imagesBobs/HomePage/homePageSwitcher/image1.jpg" width="685" height="775" alt="See what you and Old Man Mountain can do." />
<img src="imagesBobs/HomePage/homePageSwitcher/image2.jpg" width="685" height="775" alt="See what you and Old Man Mountain can do." />
<img src="imagesBobs/HomePage/homePageSwitcher/image3.jpg" width="685" height="775" alt="See what you and Old Man Mountain can do." />
<img src="imagesBobs/HomePage/homePageSwitcher/image4.jpg" width="685" height="775" alt="See what you and Old Man Mountain can do." />
<img src="imagesBobs/HomePage/homePageSwitcher/image5.jpg" width="685" height="775" alt="See what you and Old Man Mountain can do." />
<img src="imagesBobs/HomePage/homePageSwitcher/image6.jpg" width="685" height="775" alt="See what you and Old Man Mountain can do." />
</div><!-- end varal div -->