Page Width will Not Increase (MainWrapper)

12 Jan 2013, 09:03

#1

New Zenner

Join Date:: Aug 2012
Posts:: 17
Plugin Contributions:: 0

Page Width will Not Increase (MainWrapper)

For the past 2 days I have been trying to widen the main wrapper, because it looks terrible at 750px. I have changed the stylesheet.css in my template using both 100% and 1024px and it does absolutely nothing. I have been trying to figure this out for 2 days straight, and nothing works. This is is supposed to be very simple, but when I edit anything in the mainwrapper, nothing changes and I don't understand why.

www.westseedfarm.com

#mainWrapper {
background-color: #ffffff;
text-align: left;
width: 1024px;
vertical-align: top;
border: 1px solid #9a9a9a;
}

12 Jan 2013, 10:16

#2

design75

Totally Zenned

Join Date:: Dec 2009
Posts:: 2,862
Plugin Contributions:: 5

Re: Page Width will Not Increase (MainWrapper)

you have a hard-coded 770px width in the first table of you template, probably in the tpl_header.pph in your common folder
[HTML]
<body id="indexBody"> <div style="float:inherit"> <table width="770" border="0" cellspacing="0" cellpadding="0" align="center"> <tr> <td><table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFEC9D"> <tr> <td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td><img src="includes/templates/Blossoming Beauty/images/img_home1.gif" alt="img_home1" width="242" height="180"/></td> <td><img src="includes/templates/Blossoming Beauty/images/logo.gif" alt="logo" width="239" height="180"/></td> <td><img src="includes/templates/Blossoming Beauty/images/img_home2.gif" alt="img_home2" width="289" height="180"/></td> </tr> </table></td>[/HTML]

12 Jan 2013, 10:30

#3

westseedfarm

New Zenner

Join Date:: Aug 2012
Posts:: 17
Plugin Contributions:: 0

Re: Page Width will Not Increase (MainWrapper)

Just checked tpl_header.php and I don't see 770px anywhere, any other places it could be?

EDIT: found it in tpl_main_page.php About to change it to 1024

12 Jan 2013, 10:35

#4

design75

Totally Zenned

Join Date:: Dec 2009
Posts:: 2,862
Plugin Contributions:: 5

Re: Page Width will Not Increase (MainWrapper)

actually, a lot of places :laugh:, but you if you follow the trail inside the files, it should be in tpl a file loaded early in the page loading.

12 Jan 2013, 10:37

#5

westseedfarm

New Zenner

Join Date:: Aug 2012
Posts:: 17
Plugin Contributions:: 0

Re: Page Width will Not Increase (MainWrapper)

It worked! However, my header is broken up into 4 different images and looks odd and separated now, how can I easily shift the images to the left?

12 Jan 2013, 10:45

#6

design75

Totally Zenned

Join Date:: Dec 2009
Posts:: 2,862
Plugin Contributions:: 5

Re: Page Width will Not Increase (MainWrapper)

for the roses image, the lower part has a align right and a cell width of 320 px. you need to do the same for the upper part. after that you need to play around a bit to align the rest of the images, and table cells, to get them lined up again.

12 Jan 2013, 10:57

#7

westseedfarm

New Zenner

Join Date:: Aug 2012
Posts:: 17
Plugin Contributions:: 0

Re: Page Width will Not Increase (MainWrapper)

When I click on that rose image using firebug, it shows me the "320" like you said, but I can't actually see this in stylesheet.css, I can only see it in the html code that firebug shows me. How can get access to that code?

12 Jan 2013, 11:39

#8

design75

Totally Zenned

Join Date:: Dec 2009
Posts:: 2,862
Plugin Contributions:: 5

Re: Page Width will Not Increase (MainWrapper)

If it is not in the css files, you can find it directly in the template files.

13 Jan 2013, 04:11

#9

westseedfarm

New Zenner

Join Date:: Aug 2012
Posts:: 17
Plugin Contributions:: 0

Re: Page Width will Not Increase (MainWrapper)

Somehow the background was changed from black to white during all the changes. I have tried to replace the color in the stylesheet to no avail. I even tried to replace it with an image via this technique.

body {margin: 0;font-family: verdana, arial, helvetica, sans-serif;font-size: 62.5%;color: #888787;background: #fff;}

Change the code to:

body {margin: 0;font-family: verdana, arial, helvetica, sans-serif;font-size: 62.5%;color: #888787;background-image: url(../images/your-background-image-name.jpg);}

Nothing Works, and it looks pretty bad with white on the left and right side of the page (background).

I want it to be a green or tan color, though extending the orange bar at the bottom would be great too.

13 Jan 2013, 14:06

#10

stevesh

Black Belt

Join Date:: Feb 2005
Posts:: 19,793
Plugin Contributions:: 2

Re: Page Width will Not Increase (MainWrapper)

Zencart loads all stylesheets starting with 'style' and with the css extension it finds in the current template's css folder, so you have two sheets fighting each other (stylesheet.css and stylesheet1.css). Remove one or change its extension, and then you'll be able to style the site with the other.

13 Jan 2013, 22:40

#11

westseedfarm

New Zenner

Join Date:: Aug 2012
Posts:: 17
Plugin Contributions:: 0

Re: Page Width will Not Increase (MainWrapper)

stevesh:
Zencart loads all stylesheets starting with 'style' and with the css extension it finds in the current template's css folder, so you have two sheets fighting each other (stylesheet.css and stylesheet1.css). Remove one or change its extension, and then you'll be able to style the site with the other.

Thanks, I edited Stylesheet1