Align Product Details below Product Description: tpl_product_info_display.php issues

[gingertea]

Aloha,

I'm having trouble aligning my product details list below my product description. I've toggled with tpl_product_info_display.php and cannot seem to get the details to appear below the description.

Take a look:

http://www.hawaiianwoodys.com/store/...&products_id=3

I removed <br class="clearBoth" /> below

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

and it worked in IE, but not FF.

Also, the bullet appears in FF but not IE. How can I get it working in both browsers?

Mahalo for all time and energy spent reviewing my post.

Best wishes,

Kelly

[kobra]

Probably best to do this in the file and you need a clear both before the BOF for product details (I think that is the title.

Or find this tag in your style sheet and if ganged with others seperate out and add this to it

#productDescription {
        clear: both;
        }

[gingertea]

Checked to make sure <br class="clearBoth" /> appeared before product details list -- it was there.

Made change to stylesheet and the product description has now moved below product image.

?

Would like description and details to appear below title and price.

Any other advice?

[kobra]

Checked to make sure <br class="clearBoth" /> appeared before product details list -- it was there.

Would like description and details to appear below title and price.

Sorry, If you want these both tucked under the price remove the css that I suggested and remove the clear both before (that forces the new line) the descriptions

[gingertea]

Thanks again for your help, Kobra.

One problem though: after removing <br class="clearBoth" /> from beneath the product description block...its works in IE, but not FF.

That was my original problem so I figured removing <br class="clearBoth" /> wasn't the answer.

I'm stumped -- any other advice?

[gingertea]

Kobra--

I just noticed something. In FF, it's dictated by the size of the product image. That's why the product detail bullet is not aligning. Checkout the Longboards, where the product image is significantly smaller and the bullet is in its proper place.

http://www.hawaiianwoodys.com/store/...&products_id=4

Any inkling on how to fix in FF, given that it's a function of the product image?

[clydejones]

Kobra--

I just noticed something. In FF, it's dictated by the size of the product image. That's why the product detail bullet is not aligning. Checkout the Longboards, where the product image is significantly smaller and the bullet is in its proper place.

http://www.hawaiianwoodys.com/store/...&products_id=4

Any inkling on how to fix in FF, given that it's a function of the product image?

You may have to add some extra div statements to both the stylesheet and tpl_product_info_display.php

something like this:

<div id="mainProductBox"> This css for this box will make the width 100&#37;
<div id="imageBox"> This box will hold your main image and the additional images. the css for this would make the width 45% and float it to the left.

<!--bof Main Product Image -->
<?php
if (zen_not_null($products_image)) {
?>
<?php
/**
* display the main product image
*/
require($template->get_template_dir('/tpl_modules_main_product_image.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_main_product_image.php'); ?>
<?php
}
?>
<!--eof Main Product Image-->
<!--bof Additional Product Images -->
<?php
/**
* display the products additional images
*/
require($template->get_template_dir('/tpl_modules_additional_images.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_additional_images.php'); ?>
<!--eof Additional Product Images -->

</div>

<div id="productBox"> This box will hold your product information. the css for this would make the width 45% and float it to the left

<!--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 -->

<!--bof Product details list -->
<?php if ( (($flag_show_product_info_model == 1 and $products_model != '') or ($flag_show_product_info_weight == 1 and $products_weight !=0) or ($flag_show_product_info_quantity == 1) or ($flag_show_product_info_manufacturer == 1 and !empty($manufacturers_name))) ) { ?>
<ul id="productDetailsList" class="floatingBox back">
<?php echo (($flag_show_product_info_model == 1 and $products_model !='') ? '<li>' . TEXT_PRODUCT_MODEL . $products_model . '</li>' : '') . "\n"; ?>
<?php echo (($flag_show_product_info_weight == 1 and $products_weight !=0) ? '<li>' . TEXT_PRODUCT_WEIGHT . $products_weight . TEXT_PRODUCT_WEIGHT_UNIT . '</li>' : '') . "\n"; ?>
<?php echo (($flag_show_product_info_quantity == 1) ? '<li>' . $products_quantity . TEXT_PRODUCT_QUANTITY . '</li>' : '') . "\n"; ?>
<?php echo (($flag_show_product_info_manufacturer == 1 and !empty($manufacturers_name)) ? '<li>' . TEXT_PRODUCT_MANUFACTURER . $manufacturers_name . '</li>' : '') . "\n"; ?>
</ul>
<br class="clearBoth" />
<?php
}
?>
<!--eof Product details list -->

<!--bof Attributes Module -->
<?php
if ($pr_attr->fields['total'] > 0) {
?>
<?php
/**
* display the product atributes
*/
require($template->get_template_dir('/tpl_modules_attributes.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_attributes.php'); ?>
<?php
}
?>
<!--eof Attributes Module -->

<!--bof Add to Cart Box -->
<?php
if (CUSTOMERS_APPROVAL == 3 and TEXT_LOGIN_FOR_PRICE_BUTTON_REPLACE_SHOWROOM == '') {
// do nothing
} else {
?>
<?php
$display_qty = (($flag_show_product_info_in_cart_qty == 1 and $_SESSION['cart']->in_cart($_GET['products_id'])) ? '<p>' . PRODUCTS_ORDER_QTY_TEXT_IN_CART . $_SESSION['cart']->get_quantity($_GET['products_id']) . '</p>' : '');
if ($products_qty_box_status == 0 or $products_quantity_order_max== 1) {
// hide the quantity box and default to 1
$the_button = '<input type="hidden" name="cart_quantity" value="1" />' . zen_draw_hidden_field('products_id', (int)$_GET['products_id']) . zen_image_submit(BUTTON_IMAGE_IN_CART, BUTTON_IN_CART_ALT);
} else {
// show the quantity box
$the_button = PRODUCTS_ORDER_QTY_TEXT . '<input type="text" name="cart_quantity" value="' . (zen_get_buy_now_qty($_GET['products_id'])) . '" maxlength="6" size="4" /><br />' . zen_get_products_quantity_min_units_display((int)$_GET['products_id']) . '<br />' . zen_draw_hidden_field('products_id', (int)$_GET['products_id']) . zen_image_submit(BUTTON_IMAGE_IN_CART, BUTTON_IN_CART_ALT);
}
$display_button = zen_get_buy_now_button($_GET['products_id'], $the_button);
?>
<?php if ($display_qty != '' or $display_button != '') { ?>
<div id="cartAdd">
<?php
echo $display_qty;
echo $display_button;
?>
</div>
<?php } // display qty and button ?>
<?php } // CUSTOMERS_APPROVAL == 3 ?>
<!--eof Add to Cart Box-->

</div>
</div>
<br class="clearBoth">