Need help with Product Description and options

OK maybe I'm ready for the Orange belt test:D I think I am getting the concept of "float". I added float left to my Frame Conversion which brought the Seat Height next to it, which is what I wanted. The for the heck of it I added a #wAttrib-27 (Assembly Options) and removed any floats. :clap:

I used the comment field of my Seat Height option to get the text Conversion Specifications but I did create a display only Option for the same but it does not show on my web page? I am unfamiliar with this option but I thought it would act as fixed text. But what I really want is that Conversion Specifications be the same font/size/color as my other options and also stack the words on top of each other as my other option names appear.

Quote:

---

Originally Posted by TonyG485

Hi Ajeh, That must be sensei talk, I'm sure gjh42 will know exactly what you mean. But for the white belt in training, like myself, it's over my head :dontgetit Can you translate? :smile:

---

Look at the image you posted and where you have your garbage text with the words of 25+ characters long ...

Break them up into shorter words with spaces so that they are not forcing distortion issues by being so long that they cannot wrap on the page ...

Alright I understand now, I've made the changes and added ProductDescriptiion code float left in my stylesheet see below. But I still can't get my product name and description to come under model# at right of image???

#productMainImage a:link {
text-decoration: none;
}

#productMainImage {
float: left;
}
#productDescription {
float: Left;
}

There is no need to have a float on the description. You may have a <br class="clearBoth" /> between the image and description - check your "view source". That would keep the description from wrapping around the image.

Hi gjh42, thanks for checking back in.

You are right,

<br class="clearBoth" />
<?php
}
?>
<!--eof Product details list -->

I've tried every combo I can think of and still nothing works. Here is some of my code:
<!--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 Product Name-->
<h1 id="productName" class="productGeneral"><?php echo $products_name; ?></h1>
<!--eof Product Name-->

<!--bof Product description -->
<?php if ($products_description != '') { ?>
<div id="productDescription" class="productGeneral biggerText"><?php echo stripslashes($products_description); ?><div style='font-size:12px;width:100%;height:18px;'></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 -->

stylesheet: I added clear for image and put in #productdetailslist which wasn't there before.


#productMainImage {
clear: left;
}
#productDestailsList { float: Left;}

#productName {
float: left;
}

I did notice this for Model#/productDetailslist in Web Developer display element under Ancestors
html
body #productinfoBody
div #mainWrapper
table #contentMainWrapper
tbody
tr
td
div #productGeneral .centerColumn
form
div #productDescription .productGeneral biggerText
ul #productDetailsList .floatingBox back

not sure if the "floatingbox" is doing anything?

My desired order to the right of the image would be starting from the top:
Model#
Product Name
Product Description

I wanted to show you the progress I made with your great Flexible Attributes mod. :flex:

Thanks!

I still have tons of other stuff to do yet but seeing this progress keeps my motivation going which really helps. That web developer seems like a great tool. I am stumbling my way through it and finding some really useful stuf. I guess there is no manual though for beginners?

I forgot to attach a screenshot for product description wrap problem, see below.