Cherry Zen Template Support Thread

[eggdashure]

Hey guys,

Need some Wizards of smart Bi-Browser CSS help.

If you check out my site at Monumental Photos you'll see that IE displays everything just fine. If you look in Firefox, the "heading.box" is stretched way out.

Now, that said, I did have Firefox showing up correctly, but IE would shrink the heading box down to the size of the text. So it's like one or the other.

This happens when I edit the following "float" code (can either be top or left, left works in FF, top works in IE):

#navColumnOne {
float: top;
position: relative; /* IE needs this */

Appreciate the help!

Ok, after much I found a partial fix for my issue. Also, just for the record, I did start with a fresh stylesheet and followed the instructions for setting the width of my side boxes. Even after doing this IE still condensed the box heading down to the size of the text.

To correct this, in my Stylesheet on line 686 (may vary depending on your edits) look for {h3.leftBoxHeading, h3.rightBoxHeading}. I then entered values for the left and right padding. {padding:.2em 5.2em 0 5.2em;} This gave me a more desirable result in IE and FF lines up just perfect. You may need to play with the numbers to get things just right. Check out my results by clicking on Monumental Photos in my signature. Hope this helps someone down the road.

Thanks

[jettrue]

Ok, after much I found a partial fix for my issue. Also, just for the record, I did start with a fresh stylesheet and followed the instructions for setting the width of my side boxes. Even after doing this IE still condensed the box heading down to the size of the text.

To correct this, in my Stylesheet on line 686 (may vary depending on your edits) look for {h3.leftBoxHeading, h3.rightBoxHeading}. I then entered values for the left and right padding. {padding:.2em 5.2em 0 5.2em;} This gave me a more desirable result in IE and FF lines up just perfect. You may need to play with the numbers to get things just right. Check out my results by clicking on Monumental Photos in my signature. Hope this helps someone down the road.

Thanks

This doesn't happen in my default template, does it?

http://www.cherryzen.sagefish.com

[jettrue]

I'm using the Cherry Zen template and can not copy and paste off the website. How do I take out the script that doesn't allow copy and paste?
Thank you for your help in advance.

There's no such script in cherry zen.

[eggdashure]

This doesn't happen in my default template, does it?

http://www.cherryzen.sagefish.com

You know...I edited this on my PC originally (Xampp setup) then loaded it live. It looked fine in FF, so I thought I was all good (IE7 for the record).

I did like you requested and grabbed a fresh copy of the stylesheet and ran through the side-box setup. In my original setup I had both sideboxes, but left the right box turned on. I shut it off this time.

I also changed the width of the background sidebox image (sidebox.gif) to match the larger sidebox (caused by the length and amount of my category characters). Is this fluid by the way?

Also, I set the max and min widths of the site to 1000px.

Not sure if this helps at all or not.

[jettrue]

You know...I edited this on my PC originally (Xampp setup) then loaded it live. It looked fine in FF, so I thought I was all good (IE7 for the record).

I did like you requested and grabbed a fresh copy of the stylesheet and ran through the side-box setup. In my original setup I had both sideboxes, but left the right box turned on. I shut it off this time.

I also changed the width of the background sidebox image (sidebox.gif) to match the larger sidebox (caused by the length and amount of my category characters). Is this fluid by the way?

Also, I set the max and min widths of the site to 1000px.

Not sure if this helps at all or not.

My question was if this happens on my test site:

http://www.cherryzen.sagefish.com

I've never seen it happen, but you posted a "solution" which made me think perhaps its happening on my test site above.

When you increase your sidebox width, you should increase the sidebox image to exactly the same width that you have entered in the zen cart admin for the sideboxes. SO if you change the sideboxes to 180px, change the grey background image to 180px wide.

[eggdashure]

My question was if this happens on my test site:

http://www.cherryzen.sagefish.com

I've never seen it happen, but you posted a "solution" which made me think perhaps its happening on my test site above.

When you increase your sidebox width, you should increase the sidebox image to exactly the same width that you have entered in the zen cart admin for the sideboxes. SO if you change the sideboxes to 180px, change the grey background image to 180px wide.

Ok, that makes sense. But, if I remember correctly (and I've done a lot of tinkering so I could be wrong) when I increased the size of the sidebox, it's position shifted. I'll play with it tonight and report back my findings.

Again, I think this has to do with the length of my Category descriptions. They extend past the 165px setting, but I told them not to wrap. The grey box is roughly 200px, so I'll play with sidebox width and let you know.

Thanks

[bbemis]

Hi,

The site I'm working on uses the Cherry Zen template...I'm not sure if the problem we're having is related to the template or not. The problem is that the banners used in the center of the page are not aligned correctly...they are slightly right of center. Can anyone tell me where to look to make sure these are completely centered?

[Graham35]

Hi Could you please look at my site www.ishoppa.co.uk I am setting up and have just completed the head - loads more to do yet.

If you check with IE the logo gif covers part of the top menu buttons, it seems to work perfect in Opera and firefox.

Also if I switch on the sidebox/search/header.php it installs another full bar above the menu with the search box, but leaves a white box in the menu bar below where the search should be, I enclose a image of it.

I have switched off the fluid and set my site to 850px

I would be grateful if you have a look.

Thanks
Graham

ps.. this image is only part of the logo image, it does extend the full width of the webpage and includes the 5 menu buttons

[jettrue]

Hi Could you please look at my site www.ishoppa.co.uk I am setting up and have just completed the head - loads more to do yet.

If you check with IE the logo gif covers part of the top menu buttons, it seems to work perfect in Opera and firefox.

Also if I switch on the sidebox/search/header.php it installs another full bar above the menu with the search box, but leaves a white box in the menu bar below where the search should be, I enclose a image of it.

I have switched off the fluid and set my site to 850px

I would be grateful if you have a look.

Thanks
Graham

ps.. this image is only part of the logo image, it does extend the full width of the webpage and includes the 5 menu buttons

It's because the 850px is too small. Either increase that 850 little by little till it goes away, or decrease the width of #navMain from 750px little by little till it goes away.

Since you're no longer using the fluid functionality, you can change this:

#nw {
	width:850px; /* main site width; if you'd prefer a fixed width site, enter the width in px here. */
	max-width:850px; /* prevents the main content from getting wider than 1300px in sites other than IE */
	min-width:850px; /* this prevents the main content from getting smaller than 1000px in browsers OTHER THAN IE. You can make this as small as 800px, BUT any smaller than that, and the top header menu will break into two lines. Also, if you make this width 800px, you will need to make sure your product image on the product info page is no wider than 190px */
}
/* IE only. Controls Width of Site and Main Content*/
* html #nw {
 width:expression((d=document.compatMode=="CSS1Compat" ? document.documentElement : document.body) && (d.clientWidth > 1300? "850px" : d.clientWidth > 850? "100%" : d.clientWidth < 850? "850px" : "100%")); /* this prevents the site from getting smaller than 1000px or wider than 1300px in IE */
}

To this:

#nw {
	width:850px;
}

[jettrue]

Hi,

The site I'm working on uses the Cherry Zen template...I'm not sure if the problem we're having is related to the template or not. The problem is that the banners used in the center of the page are not aligned correctly...they are slightly right of center. Can anyone tell me where to look to make sure these are completely centered?

I'll need to see a link