Center panel shifted to below left sidebar

[Brewhaus]

I was informed of an issue by someone that I had testing out our DEV site, and was not able to recreate it on any of our computers. Today I was on their computer and see the issue that they were reporting- the main panel (with the products) is not to the right of the Left Sidebar as it should be. Instead, it is being move below the sidebar. This was in IE10 (which I run on one of my computers, and the site displays correctly), so I tried changing to compatibility view, but that did not resolve the problem. I also tried changing to a default theme, just in case we had changed something unintentionally. This did not correct the problem, either.

Has anyone else experienced this? How can it be corrected?

Screenshot.jpg

[compunerdy]

Rick.. No input on your issue but as someone who has been waiting to upgrade I just want to say thanks for finding all of these issues and hopefully getting AC to fix them.

[Brewhaus]

My pleasure... I guess.

[Katie]

Hi Rick,

Can you give us some information on which display page you are using and the layout? I doubt it's a bug, but I am more than happy to try and help resolve the issue.

Thanks
Katie

[Brewhaus]

Thank you, Katie.

The error occurs on a computer running Windows 7, IE10.

I tested the default theme named "Pets", which is also the theme that I used as my base when creating our own theme (basically just replacing some of the graphic files, such as the logo, top_bg, shortcut_bg, etc.). It occurs on the home page as well as CategoryGrid4, both of which are set up with a LeftSidebar layout.

Rick

[Katie]

Hi,

Your home page looks fine when I view it in IE 9 and FF. I had someone else here test it with IE10, and the layout is fine. I did notice that your product listing grid is off. The boxes that display your products should be evenly distributed, and yours are not. Have you tried switching to a theme that has no modifications?

This is likely some style modification. We've had no other reports of the left sidebar layout not working.
Katie

[Brewhaus]

I cannot get the layout to display as in the screenshot, either, and have used multiple computers and multiple browsers. But if it happens to one person, then it will happen to more.

I have tried a all of the default themes and find the products on the homepage to not be evenly distributed. In fact, I started a thread on the forum hoping that someone could help with that. I may try a fresh install and see if we have the same issues. If not, then maybe I will re-do all of my customizations and test the distribution after each so that I can find where the problem is. Unfortunately, I can only have the issue with the main panel shifting down once or twice, as it is not on a computer that I have full access to.

[Brewhaus]

Well, I tried a fresh install of AC Gold and a fresh DB (I made a copy of our current AC7 DB and linked the new Gold install to it). I have done no customizations, and have not even selected a theme or layout, and the products are not evenly distributed. Thoughts?

Screenshot-new-install.jpg

[Brewhaus]

Good news and bad news- I decided to try removing some of the images for the featured items, and when none of the items shown had images the panels were distributed evenly. If I put a couple of images back on, then when those were showing the panels would not be evenly distributed. I would have expected it to be based on the width of the image, but that was not the case. However, it does appear that the image width has a bearing. Any thoughts on how to handle this?

[Brewhaus]

Hi Katie,

I decided to try changing the dimensions of a few item images to see if this altered the panel split, and it does. If the item images are the same width, then the panels are split evenly. If the images have different widths (which is extremely common, because the original images get cropped based on the dimensions of the item artwork or photo), then the panels take a larger or smaller percentage of the overall width based on the width of the images.

This does sound like a bug to me.

Rick

[Brewhaus]

Further testing, and it turns out that the "default" theme used when you first set up the trial (Wireframe, I believe) does not create the issue mentioned previously (the main content panel dropping below the left sidebar), however, if we change the theme to Pets (which has more of the layout that we are looking for, hence it is much easier for us to build of of) then the main panel drops below the left sidebar. Changing the theme back to the default fixes the problem.

I tried viewing the source for both pages in the hopes that I could find the difference, but it is beyond me. It is likely one setting that is different in these two themes that would cause the issue. Can anyone help with this?

[jmestep]

The only time we have seen layout issues like that has been because there have been changes in html tags that have an error in them, like a missing </div> tag in the header or other layout pieces that have been customized. We have never seen that on Gold out of the box on quite a number of sites.

[Brewhaus]

It seems odd as our AC7 site is fine on that computer, but the issue is repeatable with Gold on that computer. The problem is that we cannot find another computer with the same display issue, leaving me at a complete loss.

[Katie]

When I work with the styles, I can't live without Firefox developer tools like Inspector or FIrebug. You can essentially make preview modifications to the style code and see how it will look without actually having to change and save the style.css file.

Hope this helps.
Katie

[Brewhaus]

Hi Katie,

Unfortunately, that doesn't help, as I even tried pulling how our site would display on multiple browser and OS combinations and could not replicate it. There is obviously a setting on that particular computer that is causing the display issue, but I am concerned that it could be repeated for others.

As for the panels not dividing equally if the images are of different widths, can you advise how this can be corrected?

Rick

[Brewhaus]

With a bit more tinkering I have found that it appears to only be the panels on the home page that do not split evenly if the images are a different width. Or maybe more accurately, they do split evenly if using CategoryGrid4 (I have not checked with any other CategoryGrids).

This leads me to believe that it is either something in the setup of the Home Page, or more likely, something in the FeaturedProductsGrid, PopularProductsDialog, and RecentlyViewed grids. I have looked at the files, and done some tinkering in the hopes that I could resolve this, but to no avail. Is anyone able to help with this? I assume that the method used to fix one of these grids can be repeated to fix them all.

[mazhar]

For featured products grid you can try the following and see if it makes with for columns even. Edit your style.css in current store theme and then add following line to it

Code: Select all

div.featuredProductListing table.itemListing td.tableNode {width:50% !important;}

where replace 50% with appropriate value you think will make the columns even.

[Brewhaus]

Thank you, Mazhar. Because Gold is set up for better handling of larger photos we are just re-doing all of the photos and making them 600px wide. If the artwork is the same width, then the columns split evenly.