Help with layout of center section

Hi all,

Ill admit upfront that Yes i did buy a template from Monstertemplates and yes i am having a few problems.

Ive managed to re-code quite a few things to get the template working properly but im stumped on the layout of the center section. Ive deleted the right hand column and set the settings in the admin to 0px, but in IE7 the center section wont use the extra space, its still crammed into the original width. However in firefox it stretches across as it should.

I was originally thinking that the size was hardcoded into the template, but the fact that its different in firefox is making me think again.

Ive gone through the stylesheet but for the life of me i cant find any settings to change, not obvious settings anyway.

If anyone can help then please send me your suggestions.

Thanks

Paul

Website is https://www.secretseductions.co.uk/newsite

Paul, in admin > configuration > layout settings there is an option 'Column Right Status - Global'. Have you set it to 0 (zero)?

Hi Battra,

Yep, that setting is also at 0. Forgot to put that in teh original post.

Cheers

Paul

I notice you have a CSS file 'stylesheetorig.css' which is presumably unused. Rename that to 'stylesheetorig.css.bak'. All files with .css extension will be loaded as stylesheet so that could interfere with the actual CSS.

If still doesn't work, the center box is controlled by class "centerBoxWrapper" and ID "specialsDefault". Can you try to play with that e.g. set to 100% width? I don't see them in your stylesheet right now.

Hmmmm stylesheetorig.css is actually the original Zencart stylesheet which i am loading up aswell. whoever made the template missed out alot of the basic Zencart css style in their new template, the easiest thing to do was load this stylesheet up aswell. even without this stylesheet the page doesnt work as it should. To be quite honest im stumped!!

cheers

Paul

You should probably disregard this post but just to let you know I'm having the same problems with a MonsterTemplate template. They make it seem 'so' easy don't they? LOL

As of last night I am making them fix the problem I'm having. The product description text & price is disappearing in IE. Works fine in FireFox, just IE!

Oh if only all the world used FireFox.

Wilkesy:

Hi all,

Ive managed to re-code quite a few things to get the template working properly but im stumped on the layout of the center section. Ive deleted the right hand column and set the settings in the admin to 0px, but in IE7 the center section wont use the extra space, its still crammed into the original width. However in firefox it stretches across as it should.

First question. What version of Zen are you running? Template Monster is known for telling people that their Zen templates are "compatible", but the vast majority of them on the site are built for older versions of zen (that used tables). The new layout is tableless.

The problem with the column not stretching in IE is a stylesheet issue (obviously). It has to deal with the "width" of the various div sections in relation to the number of columns and their absolute position on the page. I would have to look closer at the template to see "what" exact sections are affected, but I can tell you from first look at the site, it is without a doubt a stylesheet width issue. (I see the difference under the two browsers).

Second point here. You do not need to "delete" the right column. If you want to get rid of it, you should use either the "Global Override" option from within the admin (Configuration > Layout Settings > Column Right Status - Global) to turn it off, or "manually override the file" by altering the code on that individual page (near the top). Instructions for doing so are at the top of each page.

To alter the width of the columns, and side boxes go to Configuration > Layout Settings > Column Width Right Boxes and/or **Configuration > Layout Settings > Column Width - Right **

I was originally thinking that the size was hard coded into the template, but the fact that its different in firefox is making me think again.

The size is completely controlled by the stylesheet. You can alter it there (for he entire site). Column widths are controlled from the admin (as indicated above).

Ive gone through the stylesheet but for the life of me i cant find any settings to change, not obvious settings anyway.

Again, see above.

lastly, make sure you read the way the stylesheet system works in Zen. The stylesheet is probably not "missing" any information (you mentioned in another post that it is missing some "basic information"). The stylesheet is probably supposed to work "in conjunction with" the default stylesheet. If you follow the stylesheet "system" that zen is setup to use, you should not have to alter the main stylesheet to get it to work.

For example, you would have "stylesheet.css" (the main one) in the "css" directory. If you simply upload the stylesheet that came with the template to the same "css" directory, and name it "stylesheet-monster.css" (or whatever you want) then it will automatically load upon loading the page ... as long as you START the file name with "stylesheet" that is.

A link to the way the stylesheet override system works is here for reference. It may also help.

https://www.zen-cart.com/tutorials/index.php?category=4

Hi econcepts,

Ive used a brandnew installation of Zencart with the latest download so i should be on the latest version.

From what i can see with the template there are no tables hardcoded into the files. It all look purely css based, which is good.

On your second point about deleting the right hand column, i havent physially deleted it, just turned it off in the admin as you said. Ive turned the global setting to 0, and also the widths ive set to 0.

The monsters template stylesheet was named stylsheet.css, so all ive done is renamed the standard zencart stylesheet to stylesheetorig.css so that it is loaded up properly. from what ive read that was the correct way to do it?

Would it be easier if i included a copy of the stylesheet here for you to look through??

Thanks for your help

Paul

Wilkesy,

No need to shoot the stylesheet over to me. I already have it right here (just downloaded) :).

Let me look at it and I'll have a reply here shortly.

Hang in there ...

Here's your answer.

The template is made up of a combination of tables and styles. Therefore, when you eliminate the right hand column from within the admin, the actual "table cell" to which the "Index main content" gets placed (and is set to a hard coded "346") does not alter itself.

So, what do you do to fix it to be cross-browser compatible? I'll give you two solutions -- the quick way, and the preferred way.

1. Open up your "main page template" that control the layout of the site (since I do not have access to your server, and I do not know how Monster set the template up, I am assuming that it is like the rest of Zen and the file you need to make alterations to is found in "/includes/[your template]/templates/common/tpl_main_page.php"

Find the section that looks like this:

    <td valign="top" width="346px">
<!-- bof  breadcrumb -->
<!-- eof breadcrumb -->

and change it to this:

    <td valign="top" width="546px">
<!-- bof  breadcrumb -->
<!-- eof breadcrumb -->

That will fix the layout issue under both IE and Firefox.

Now, although that method will work, I would suggest you maybe create a few new styles for each of those cells (in a "new" stylesheet maybe called "stylesheet-layout.css" or something descriptive that lets you know "what" the file does) and set the widths there.

You will need to make some code alterations to it anyhow but the styles themselves will make it easier to alter later on if needed.

Here is a sample url (up for a short time only) to show you the corrected version you should get after making my changes above (either way).

I put a thin "black border" around the area I altered ONLY for you to see the width adjusted. My directions above do not include the "black border" as you do not need it. Again, that was just for easy viewing to let you know which part of the page needed the adjustment.

http://www.enhancedconcepts.com/z1-3-6_demo/test.php

Let me know if you need anything. Good luck!

Hi,Brilliant! Thanks for you rhelp with this.
If i could buy you a beer then i would!

I will admit though that i was nearlythere with finding the solution. Whoever made the temmplate has already put a style in the sheet, but they dont seem to use it anywhere. I was changing the setting and nothing was happening.

Im going to get rid of that table cell and use the proper process of doing the layout.

Thanks for your help with this, really is appreciated!

Paul

Glad I could help. :)

P.S. The beer was nice and cold. :)