Jump to content
dev osCommerce
Forum
  • Checkout
  • Login
  • Contact Us
  • Get in touch

osCommerce

The e-commerce.

New Demo
Our Partners

centering fixed witdth

nihanshe

By nihanshe
in General Support

Recommended Posts

nihanshe

nihanshe

Posted
Posted

Hi I recently installed a fixed width modal, (fixed width with css)

 

Here's the code I install this works great in firefox but in IE this is over to the left side, how can i fix this.

Regards to all,

Mervyn

 

1. A minor modification is required to your stylesheet.css file.

 

Replace the following code:

---------------------------

 

BODY {

background: #ffffff;

color: #000000;

margin: 0px;

}

 

with:

-----

 

BODY {

text-align: center;

background: #ffffff;

color: #000000;

margin: 0px;

}

 

.fixcenter {

width: 758px;

border: solid; border-width: 1px;

background: #ffffff;

color: #000000;

margin: auto;

margin-top: 20px;

text-align: left;

}

 

2. On-page changes:

 

In /catalog/includes/header.php

-------------------------------

immediately below this piece of code

 

if ($messageStack->size('header') > 0) {

echo $messageStack->output('header');

}

?>

 

add

 

<div class="fixcenter">

 

In catalog/includes/footer.php

------------------------------

 

Immediately below the closing php tag

 

?>

 

add this

 

</div>

nihanshe

nihanshe

Posted
  • Author
Posted
change

<div class="fixcenter">

to

<div id="fixcenter">

 

Nic

 

 

Thanks Nic for the reply, sorry mate tried this but it stretches out the whole page and screws up the style, any help would be great, I just wanted a quick way to center new installed shop to 758px without having to change all the page in catalog/

 

Kind regards Mervyn

Hotclutch

Hotclutch

Posted
Posted

This is from the Contributions section, and works well.

 

 

 

 

To center & size Shop

 

At the very start of header.php add:

 

<div id="content">

 

then at the very bottom of footer.php add:

 

</div>

 

then add to your css:

 

#content {

width: 900; margin: auto;

border: 1px solid #999999;

text-align:center;

}

 

and add to the BODY tag

 

text-align:center;

 

Obviously set width above to whatever you need.

nihanshe

nihanshe

Posted
  • Author
Posted
This is from the Contributions section, and works well.

 

 

 

 

To center & size Shop

 

At the very start of header.php add:

 

<div id="content">

 

then at the very bottom of footer.php add:

 

</div>

 

then add to your css:

 

#content {

width: 900; margin: auto;

border: 1px solid #999999;

text-align:center;

}

 

and add to the BODY tag

 

text-align:center;

 

Obviously set width above to whatever you need.

 

 

"Hi sorry to be a bit dim" not done to much of this, but where do I add the code: text-align:center; have I got to change every single file within mystore/catalog

Kind regards Mervyn

nihanshe

nihanshe

Posted
  • Author
Posted
"Hi sorry to be a bit dim" not done to much of this, but where do I add the code: text-align:center; have I got to change every single file within mystore/catalog

Kind regards Mervyn

 

 

Ok I think I have installed the text-align:center; code in the right place (I think) on the catalog/index.php <body marginwidth="0" marginheight="0" topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0" style="text-align: center"><div class="body">

 

now works fine in firefox but in IE it's over to the left again.

Not getting on to well with this I must admit

 

http://www.turnedpens.co.uk/catalog/index....efeda7819808212

Guest

Guest

Posted
Posted

Maybe it's just me but I don't see anything in your source code that you were told to do such as

At the very start of header.php add:

 

<div id="content">

 

then at the very bottom of footer.php add:

 

</div>

 

then add to your css:

 

#content {

width: 900; margin: auto;

border: 1px solid #999999;

text-align:center;

}

 

and add to the BODY tag

 

text-align:center;

 

Obviously set width above to whatever you need

You have this in your stylesheet

BODY {
 text-align: center;
 background: 535300;
 color: #000000;
 margin: 0px;
}

.body {
 width: 758px;
 border: solid; border-width: 2px;
 background: #ffffff;
 color: #000000;
 margin: auto;
 margin-top: 20px;
 text-align: left;
}

That creates a conflict. Change to

BODY {
 text-align: center;
 background: 535300;
 color: #000000;
 margin: 0px;
}

#content {
 width: 758px;
 border: solid; border-width: 2px;
 background: #ffffff;
 color: #000000;
 margin: auto;
 margin-top: 20px;
 text-align: left;
}

Then do as instructed by Ashley.

Hotclutch

Hotclutch

Posted
Posted
"Hi sorry to be a bit dim" not done to much of this, but where do I add the code: text-align:center; have I got to change every single file within mystore/catalog

Kind regards Mervyn

 

That bit of code goes in your stylesheet.css

 

Look for this near the top of the file

 

BODY {

background: #ffffff;

color: #000000;

margin: 0px;

}

 

and change so that it looks like this

 

BODY {

background: #ffffff;

color: #000000;

margin: 0px;

text-align:center;

}

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...