Position image in sidebox

[Ahroo]

I have a sidebox which contains only an image. I would like the image to be centered within the box, but cannot figure out how to do it. My site is http://www.createdbygayle.com/zencart/ and the sidebox in question is the one that says "We Accept".

I tried to fix it in the stylesheet, but only ended up centering the text in other boxes. My sidebox files are:

creditcard_sidebox.php:
<?php
$show_creditcard_sidebox = true;
if ($show_creditcard_sidebox == true){
require($template->get_template_dir('tpl_creditcard_sidebox.php',DIR_WS_TEMPLATE,
$current_page_base,'sideboxes'). '/tpl_creditcard_sidebox.php');
$title = BOX_HEADING_CREDITCARD_SIDEBOX;
$left_corner = false;
$right_corner = false;
$right_arrow = false;
require($template->get_template_dir($column_box_default, DIR_WS_TEMPLATE,
$current_page_base,'common') . '/' . $column_box_default);
}
?>

tpl_creditcard_sidebox.php:
<?php
$content =
'<img src="images/CC-logos.gif" align="center">';
?>


and creditcard_sidebox_defines.php:
<?php
define('BOX_HEADING_CREDITCARD_SIDEBOX', 'We Accept');
?>

Can anyone help me with the correct coding to fix this? I'm sure it is a simple thing, but I am baffled! Thank you!

Laura

[jund]

Ahroo
The easy way is to modify the code as follows:
<!--// bof: creditcardsidebox //-->
<div class="leftBoxContainer" id="creditcardsidebox" style="width: 152px" align="center">
<h3 class="leftBoxHeading" id="creditcardsideboxHeading">We Accept</h3>
<img src="images/CC-logos.gif"></div>
<!--// eof: creditcardsidebox //-->

EXPLANATION:
Your div class includes 'controls' for the contents of ="leftBoxContainer" - and they are style, etc. You should include your align control within the div class as shown in green above.
Also, delete your alignment statement from <img src="images/CC-logos.gif">.

Hope that works ok for you.
jund

[Ahroo]

Jund,

Thank you for your kind assistance, but I guess I am just too dense to understand php!

I'm not clear on where the new code should go. I tried adding it to the stylesheet.css file, but that did not change anything, so then I tried putting it into the tpl_creditcard_sidebox.php file, both before the $content= line and after it. Still no change. Can you clarify for me just exactly where it is to go? And how do I set the ID so that it knows to reference this sidebox? Does that question even make sense?

Laura

[jund]

You are not dense!
First, I apologize - the code I showed you is html generated from the php - not the original php - so I am an idiot for even showing it to you, I am sorry. I do not have a CC Sidebox - so I do not know where the php code is for it.

OK - moving forward... How did you install the PayPal seal in the side box below the cc side box? It is centered. Take a look at METHOD 1 below -


METHOD 1 code 'fix' Refer to the PayPal seal box
If you look at the code for it, the PayPal seal is verification_seal.gif. It has an old-fashioned html tag <center>~~~~~~</center> surrounding it. It is a deprecated tag... but it's there anyway. You might try the same technique with your CC-logos.gif .

METHOD 2 Graphical 'fix'
You could also take the CC-logos.gif and center it on a white gif that is the same width as your container (152 pixels) Note the CC-logos.gif is 92x88.

If you use method 2 above, it would be centered regardless of your settings.

Respectfully,
jund

[jund]

I created you a graphic as listed in method 2.
CC-logos2.gif
jund

[Ahroo]

Method 2 - what an obvious solution! DUH!!! Now I really feel like an idiot! Thank you so much for not only pointing the way, but even taking the time to revise the image for me. That was very nice of you and it is greatly appreciated!

Laura

[jund]

Sounds like you are having fun again - me too! Enough of this self criticism.
And, you are welcome,
jund

[gjh42]

Adding to your stylesheet:

#creditcardsidebox img { text-align: center;}

should center the image in the box without any other work.

Using the gif sized for the box will also work fine as long as the box stays the same.

[jund]

gjh42,

Great support! You are absolutely right - especially regarding size changes... why didn't I think of that.
Another reason your suggestion is superior is because you are using the style sheet to manage the page, rather than relying upon the memory of the webmaster.

Thanks,
jund

[Anir24]

Hello everyone

I am trying to do exact same thing as Laura did, but I do not really know where to start or what to do.

I want to add a sidebox of verified paypal and anotehr sidebox of we accept, exact same thing that Laura did in her website.

Can any one please help on how to do it?

Any help would be appreciated

Thank you guys

Regards

Anir