Can't seem to find the proper division to change in css

[andycowboy]

Good morning!

Thought I had a pretty good working knowledge of .css, but I have spent several hours the last couple of days trying to figure this out...

Using zc v1.3.9h with glacial age template

I got hacked the beginning of November, and, unfortunately, had to start from scratch again - backup offline files wouldn't upload properly - probably missing something on my end - still trying to figure out exactly how to use filezilla! Been slowly working on making things right...missed this selling season anyway. Making headway, but just stuck on a couple of issues with the product description!

Take a look at a product page...only have two up while I tweak things. Here's one...and here's the other.

I got the product name and price centered, as desired, as well as getting the text justified. I haven't been able to do the following:

- have the product name drop down a little so that it's about 1/3 of the way below the top of the image
- have the description drop below the image and be justified from the left, rather than having all that open space under the image

I have played with margin settings, padding settings, productbox width (if I change that to 100%, it drops everything below the image, but I'd like to have the productname to the right as shown and as stated above)...what the heck am I missing?

Here are the portions applicable to the problem from the stylesheet: Sorry, couldn't find a way to attach a .css file!

product_info.css

#mainProductBox {
margin: 0 auto;
padding: 0;
}
#imagebox {
margin:0;
padding:0;
width:20%;
float:left;
}
#productMainImage {
margin:1.5em 1em 1em 0;
}
#productbox {
margin:0;
padding:0;
width:60%;
float:right;
}
h1#productName {
margin:0;
padding:0;
font-weight:700;
text-align:center;
}
#productDescription {
margin:0;
padding:0 0 2px 0;
line-height:1.3em;
}
#productPrices {
margin:0;
padding: 2px 0;
font-weight:700;
text-align:left;
}

There is also a stylesheet.css...I don't think anything there applies directly to these issues, and it's very lengthy - didn't want to just copy and paste it.

Any guidance would sure be appreciated! Thanks for your time...have a great day, and God bless!

[stevesh]

Here's one way:

h1#productName {
margin-bottom:50;
padding:0;
font-weight:700;
text-align:center;
margin-top: 2em;
}
#productDescription {
margin: 4em 0 0 -13em;
padding:0 0 2px 0;
line-height:1.3em;
text-align:justify;
}

If the product name weren't in the same productBox div as the description, you probably wouldn't need the negative margin.

[andycowboy]

Thanks, Steve, but that didn't work...but you might have hit on something. I can handle html/css pretty well...

Maybe I can move the product name outside of the product box...but where do I make that change in html? All I can find are .php pages

[RescoCCC]

Maybe I can move the product name outside of the product box...but where do I make that change in html? All I can find are .php pages

There are no html pages, Zen Cart is PHP driven. The PHP to edit would be includes/templates/your_template/templates/tpl_product_info_display.php

[andycowboy]

OK, Resco...now might be my opportunity to start learning how php works.

I found what you told me to look for:


<!--bof Product Name-->
<h1 id="productName" class="productGeneral"><?php echo $products_name; ?></h1>
<!--eof Product Name-->

<!--bof Product Price block -->
<h2 id="productPrices" class="productGeneral">
<?php
// base price
if ($show_onetime_charges_description == 'true') {
$one_time = '<span >' . TEXT_ONETIME_CHARGE_SYMBOL . TEXT_ONETIME_CHARGE_DESCRIPTION . '</span><br />';
} else {
$one_time = '';
}
echo $one_time . ((zen_has_product_attributes_values((int)$_GET['products_id']) and $flag_show_product_info_starting_at == 1) ? TEXT_BASE_PRICE : '') . zen_get_products_display_price((int)$_GET['products_id']);
?></h2>
<!--eof Product Price block -->

<!--bof free ship icon -->
<?php if(zen_get_product_is_always_free_shipping($products_id_current) && $flag_show_product_info_free_shipping) { ?>
<div id="freeShippingIcon"><?php echo TEXT_PRODUCT_FREE_SHIPPING_ICON; ?></div>
<?php } ?>
<!--eof free ship icon -->

<!--bof Product description -->
<?php if ($products_description != '') { ?>
<div id="productDescription" class="productGeneral biggerText"><?php echo stripslashes($products_description); ?></div>
<?php } ?>
<!--eof Product description -->
<br class="clearBoth" />


Now, my question, keeping in mind that I have no working knowledge of php...do I move something around, like moving a div in an html document? What, exactly, do I do with this information to maybe make the changes I want?

As always, mucho gracias for the help! Just an old(er) guy trying to learn something new, and php has me completely confused!

Have a great evening, and God bless!

[andycowboy]

Been thinking through this...let's see if I'm on the right track:

I need to find any .css files pertaining to "productDescription" and make changes there, then the php will automatically do what needs to be done. Before I start doing this, am I headed the right direction?

Have a great day!