Forums / Templates, Stylesheets, Page Layout / Why the heck can't I center this thing?

Why the heck can't I center this thing?

Locked

Views: 1,248

Results 1 to 7 of 7
This thread is locked. New replies are disabled.
17 Jun 2008, 10:21 PM
#1
medragon avatar

medragon

New Zenner

Join Date:
Jun 2008
Location:
In the mountains
Posts:
63
Plugin Contributions:
0

Why the heck can't I center this thing?

I have tried to center this every which way but Sunday!:frusty:
I want the whole table that everything is in to be centered.

This is the page:
http://www.beadedpatterns.com/home/
Please ignore the content, I'm getting ready to do the re-install,
I just want to know how to center this page before I move on, because it is driving me crazy.

I know that it something simple and that I've just missed something stupid like a comma!! maybe!

Here's the example in html:
It's like this::oops:
http://www.uniquebeadedjewelry.com/example1.html

I want it to be like this::smile:
http://www.uniquebeadedjewelry.com/example2.html

You have to have a wide screen to see what I am wanting.
Thanks
Dragon

17 Jun 2008, 11:48 PM
#2
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Why the heck can't I center this thing?

You have #mainWrapper properties scattered all over```
/wrappers - page or section containers/
#mainWrapper {
width: 900px;
background-color: #000000;
float: center;
text-align: center;
vertical-align: top;
border: 1px solid #CC99FF;
}

#logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
margin: 0em;
padding: 0em;
}

#contentMainWrapper {
background-color: #000000;
padding-top: .50em;
}

#headerWrapper {
background-color: #000000;
margin: 0em;
padding: 0em;
}

#navColumnOneWrapper, #navColumnTwoWrapper, #mainWrapper {
margin: auto;
}


The problem underlying that is that you have set the body width to 900px also, so there is no room for #mainWrapper to move.
Remove the 
width: 900px; 
completely from body {}.
18 Jun 2008, 12:29 AM
#3
medragon avatar

medragon

New Zenner

Join Date:
Jun 2008
Location:
In the mountains
Posts:
63
Plugin Contributions:
0

Re: Why the heck can't I center this thing?

When I remove the width: 900px; from the body, the table opens up to the whole page.
This is not what I am wanting to do.
I want the main body/table of my page to be 900px.

So that it looks like a page in the center of your screen.

So now what!!

Dragon

18 Jun 2008, 12:59 AM
#4
dbltoe avatar

dbltoe

Totally Zenned

Join Date:
Jan 2004
Location:
N of San Antonio TX
Posts:
9,843
Plugin Contributions:
17

Re: Why the heck can't I center this thing?

Glenn's suggestion of removing the width call from the body is correct. However, you have so many things mixed between body and the various wrappers that almost anything can happen.
For instance, the margin: 10% in the body. That would not be needed if something else "interesting" hadn't been done elsewhere.

Need a hand with Zen Cart? Hire the team at myZenCartZone.com for upgrades, repairs, and custom plugins.
Zen Cart Certified hosting at myZenCartHost.com

18 Jun 2008, 1:33 AM
#5
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Why the heck can't I center this thing?

You have an extra </div>, possibly the one after <!--eof-header ezpage links-->, which is ending #mainWrapper so that it does not enclose the whole site.

18 Jun 2008, 4:30 AM
#6
medragon avatar

medragon

New Zenner

Join Date:
Jun 2008
Location:
In the mountains
Posts:
63
Plugin Contributions:
0

Re: Why the heck can't I center this thing?

Thanks everyone!! I'm going to start over on my css file.
Maybe I will do it better this time.

Dragon

18 Jun 2008, 4:55 AM
#7
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Why the heck can't I center this thing?

The problem I mentioned is in your tpl_header.php file. You need to get that correct before the stylesheet can work properly.