Product description issues

[mollycakes]

For some reason no matter what I do my product description keeps showing up bold. I only want parts of the description bold such as the "product name" and the "Ingredients" title. The only way I can get any text to not show up bold is to set it to 8pt. I'm trying to set it to 10pt but just keeps showing up bold. Anyone know what may cause that? Here is the page http://mollysoap.com/shop/index.php?...&products_id=1

Here is my css for this section

/*.content,*/ #productDescription, .shippingEstimatorWrapper {
/*font-size: 1.2em;*/
padding: 0.5em;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10pt;
color: #404040;
}

#productDescription {
float: left;
width: 50%;
padding: .5em 0em 0em 0em;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10pt;
font-style: ;
}

#productDescription p{
margin-right: 3.5em;
}

[dbltoe]

Looks like you're fighting a battle between the html editor in the product description and the stylesheet.

Unfortunately, the code in the description will win out over the stylesheet.

If you are familiar with html, I would lose the editor and code the product info yourself.

[mollycakes]

Uh huh! Okay so I'm not too good with html. Frontpage is my hero! So if I want to keep my fancy table how would I define the style into my html so my text appears correctly?

[dbltoe]

First of all, get rid of FrontPage when dealing with anything but a FrontPage site. It will leave garbage everywhere!

As to the html....

In the html editor, you should see the "double arrows" that look like <>. Clicking on this will take you to the bare code for the text.

In one case, you'll see something like

<div style="border: 1px dotted rgb(220, 225, 228);">
    <p>
        <font size="1">
            <b>
                <font color="#666666" face="Arial">
                    <br>
                        <font style="font-family: verdana,arial,helvetica,sans-serif;" size="2">
                             Bohemian
                        </font>
                </font>
             </b>
        </font>
    </p> 

Actually all we are trying to do here is format the title "Bohemian". It's been put in a <p>, made <b> (outdated BTW), given a font color, and a style. All of these will do battle with the stylesheet.

If you were to use

<div class="myProdDesc">
    <h1>
        Bohemian
    </h1> 

Then, in your stylesheet, you could easily adjust the items using the myProdDesc class to help you. You may find that changing the H1 to H2, H3 or H4 may give you what you want without further coding.

You tables should be done with <div> instead of a table in order to be up to date. You're just creating two columns with information in each. If you enter "two columns with css" into Google, you'll find many examples of how it can be done.

[mollycakes]

Even in plain html not defining any text whatsoever I still get bold text!

Here is my inserted html

<table width="550" cellspacing="3" cellpadding="3" bordercolor="#dce1e4" border="1" bgcolor="#ffffff" style="border-collapse: collapse;" id="AutoNumber2">

<tbody><tr>
<td width="50%" valign="top">
<p align="center">
<br />
<img width="222" height="169" border="0" src="images/bohemian.jpg" /></p></td>
<td width="50%" valign="top">
<div style="border: 1px dotted rgb(220, 225, 228);">
<p><br />
Bohemian</p>
<p align="left">

Very nummy indeed!
Sweet uplifting citrus blend of lemon, lemongrass, pink grapefruit
and patchouli essential oils with a hint of ylang ylang. 4oz.</p>

<p align="left">

Ingredients:
Rice bran oil, palm oil, coconut oil, shea and cocoa butters, olive
oil, lemon, lemongrass, pink grapefruit, patchouli, ylang ylang
essential oils.<br />
<br />
</p>
</div>
</td>
</tr>
</tbody></table>

[mollycakes]

Sorry I guess we posted at the same time. LOL I will give that a shot!

[dbltoe]

Something like this might work. Into your product description, insert (using the <>) the following html code:

<div id="myProdWrapper">
    <div id="myProdDescWrapper">
        <div id="MyProdDescText">
            <h2>Bohemian</h2>
            <p>Very nummy indeed! Sweet uplifting citrus blend of lemon, lemongrass, pink grapefruit and patchouli essential oils with a hint of ylang ylang. 4oz.</p>
        </div>
    </div>
    <div id="MyProdDescImg"><img src="images/bohemian.jpg" /></div>
</div> 

Then, in your stylesheet, add the following to the end of the stylesheet.

/* bof Code for two-column Product Descriptions*/

#myProdWrapper{
width: 550px; /*Width of main product wrapper*/
margin: 0 auto; /*Center product wrapper on page*/
}

#myProdDescWrapper{
float: left;
width: 100%;
}

#MyProdDescText{
margin-left: 222px; /*Set left margin to product image width*/
}

#MyProdDescImg{
float: left;
width: 222px; /*Width of product image*/
margin-left: -550px; /*Set left margin to -(myProdWrapper Width)*/
}

/* eof Code for two-column Product Descriptions*/ 

[dbltoe]

Note that I've taken a lot of the "coded-in" information and left it to be taken care of by the stylesheet.

If you make 222px the standard for your product images, you won't need to change that figure every time you add a new product. You would just need to change the <h1>, <p> and <img> data for each product.

Lastly, just a pet peeve of mine. I add

p {
    text-align: justify;
} 

to all my stylesheets because I think the justified text looks neater. Up to you.

[mollycakes]

Awesome! I had been sitting here forever trying to get this right! The placement looks so much nicer but for some reason the text is still bold! LOL There must be something else causing it. Here is my stylesheet. Maybe you'll see something I'm missing.

body {
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10pt;
color: #404040;
background-color: #;
background-image: url('/images/bg.gif');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: right;
margin-left: 0px;
margin-top: 0px;
}

.greeting {
text-align: right;
font-size: 8pt;
}

#logosidebox{
margin: 0em;
margin-top: 5px;
border:none;
}

#logosideboxContent {
text-align:left;
}

#logosideboxHeading{
margin: 0;
padding: 0;
}

a img {border: none; }

a:link, #navEZPagesTOC ul li a {
color: #404040;
text-decoration: none;
}

a:visited {
color: #404040;
text-decoration: none;
}

a:hover, #navEZPagesTOC ul li a:hover, #navMain ul li a:hover, #navSupp ul li a:hover, #navCatTabs ul li a:hover {
color: #79664B;
}

a:active {
color: #79664B;
}

h1 {
font-size: 10pt;
font-weight: bold;
}

h1#productName {
float: right;
margin: 0em 1.0em;
}

h2 {
font-size: 10pt;
font-weight: bold;
}

h3 {
font-size: 10pt;
font-weight: bold;
}

h4, h5, h6, LABEL, h4.optionName, LEGEND, ADDRESS, .sideBoxContent, .larger{
font-size: 10pt;
font-weight: ;
}

.biggerText {
font-size: 10pt;
font-weight: ;
}

h1, h2, h3, h4, h5, h6 {
margin: 0.3em 3px;
font-size: 10pt;
font-weight: bold;
}


h2#productPrices {
float: right;
margin: 0em 1.0em;
}

#cartAdd {clear: right;
text-align: right;
padding: 0em;
margin: -0.1em;
}

#productDetailsList {
float: right;
margin: 0em 1.0em;
font-weight: ;
font-size: 10pt;
width: 30%;
}

CODE {
font-family: arial, verdana, helvetica, sans-serif;
font-size: 10pt;
}

FORM, SELECT, INPUT {
display: inline;
font-size: 10pt;
margin: 0.1em;
}

TEXTAREA {
/* float: left;*/
margin: auto;
display: block;
width: ;
}

input:focus, select:focus, textarea:focus {
background: #;
}

FIELDSET {
padding: 0.5em;
margin: 0.5em 0em;
border: 1px solid #;
}

LEGEND {
font-weight: bold;
padding: 0.3em;
}

LABEL, h4.optionName {
line-height: 1.5em;
padding: 0.2em;
}

LABEL.checkboxLabel, LABEL.radioButtonLabel {
margin: 0.5em 0.3em;
}

#logo, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .centerBoxContentsAlsoPurch, .attribImg {
float: left;
}

LABEL.inputLabel {
width: 11em;
float: left;
}

LABEL.inputLabelPayment {
width: 15em;
float: left;
}

LABEL.selectLabel, LABEL.switchedLabel, LABEL.uploadsLabel {
width: 12em;
float: left;
}

P, ADDRESS {
padding: 0.5em;
}

ADDRESS {
font-style: normal;
}

.clearBoth {
clear: both;
}

HR {
height: 1px;
margin-top: 0.5em;
border: none;
border-bottom: 1px solid #;
}

/*warnings, errors, messages*/
.messageStackWarning, .messageStackError, .messageStackSuccess, .messageStackCaution {
line-height: 1.8em;
padding: 0.2em;
border: 1px solid #;
}

.messageStackWarning, .messageStackError {
background-color: #;
color: #404040;
}

.messageStackSuccess {
background-color: #;
color: #404040;
}

.messageStackCaution {
background-color: #;
color: #404040;
}

/*wrappers - page or section containers*/
#mainWrapper {
background-color: #;
text-align: left;
width: 100%;
vertical-align: top;
margin-left: 0em;
margin-top: 0em;
width:750px !important; }

#headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
margin-left: 0em;
margin-top: 0em;
padding: 0em;
}

#navColumnOneWrapper, #navColumnTwoWrapper, #mainWrapper {
margin-left: 0em;
margin-top: 0em;
}

#tagline {
color:#404040;
font-size: 2em;
text-align : center;
vertical-align: middle;
}

#sendSpendWrapper {
border: 1px solid #;
float: right;
margin: 0em 0em 1em 1em;
}

.floatingBox, #accountLinksWrapper, #sendSpendWrapper, #checkoutShipto, #checkoutBillto, #navEZPagesTOCWrapper {
margin: 0;
width: 47%;
}

.wrapperAttribsOptions {
margin: 0.3em 0em;
}

/*navigation*/

.navSplitPagesResult {}
.navSplitPagesLinks {}
.navNextPrevCounter {
margin: 0em;
font-size: 0.9em;
}
.navNextPrevList {
display: inline;
white-space: nowrap;
margin: 0;
padding: 0.5em 0em;
list-style-type: none;
}

#navMainWrapper, #navSuppWrapper, #navCatTabsWrapper {
margin: 0em;
background-color: #;
font-weight: bold;
color: #404040;
height: 1%;
width: 100%;
}

#navMain ul, #navSupp ul, #navCatTabs ul {
margin: 0;
padding: 0.5em 0em;
list-style-type: none;
text-align: center;
line-height: 1.5em;
}

#navMain ul li, #navSupp ul li, #navCatTabs ul li {
display: inline;
}

#navMain ul li a, #navSupp ul li a, #navCatTabs ul li a {
text-decoration: none;
padding: 0em 0.5em;
margin: 0;
color: #404040;
white-space: nowrap;
}

#navEZPagesTOCWrapper {
font-weight: bold;
float: right;
height: 1%;
border: 1px solid #;
}

#navEZPagesTOC ul {
margin: 0;
padding: 0.5em 0em;
list-style-type: none;
line-height: 1.5em;
}

#navEZPagesTOC ul li {
white-space: nowrap;
}

#navEZPagesTOC ul li a {
padding: 0em 0.5em;
margin: 0;
}

#navCategoryIcon, .buttonRow, #indexProductListCatDescription {
margin: 0.5em;
}

#navMainSearch {
float: left;
}

#navBreadCrumb {
background-color: #;
}

#navEZPagesTop {
background-color: #;
}

#navBreadCrumb, #navEZPagesTop {
font-size: 0.95em;
font-weight: bold;
margin: 0em;
padding: 0.5em;
}

#navColumnOne {
background-color: #;
}

#navColumnTwo {
background-color: #;
}

/*The main content classes*/
#contentColumnMain, #navColumnOne, #navColumnTwo, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew, .alert {
vertical-align: top;
}

/*.content,*/ #productDescription, .shippingEstimatorWrapper {
/*font-size: 1.2em;*/
padding: 0.5em;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10pt;
color: #404040;
}

#productDescription {
float: left;
width: 50%;
padding: .5em 0em 0em 0em;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10pt;
}

#productDescription p{
margin-right: 3.5em;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10pt;
}

.alert {
color: #404040;
margin-left: 0.5em;
}
.advisory {}
.important {
font-weight: bold;
}
.notice {}
.rating{}
.gvBal {
float: right;
}
.centerColumn, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix {
padding: 0.8em;
}

.smallText, #siteinfoLegal, #siteinfoCredits, #siteinfoStatus, #siteinfoIP {
font-size: 0.9em;
}

/*Shopping Cart Display*/
#cartAdd {
float: right;
text-align: right;
margin: 0.1em;
border: 1px solid #;
padding: 0em;
}

.tableHeading TH {
border-bottom: 1px solid #;
}

.tableHeading, #cartSubTotal {
background-color: #;
}

#cartSubTotal {
border-top: 1px solid #;
font-weight: bold;
text-align: right;
line-height: 2.2em;
padding-right: 2.5em;
}

.tableRow, .tableHeading, #cartSubTotal {
height: 2.2em;
}

.cartProductDisplay, .cartUnitDisplay, .cartTotalDisplay, .cartRemoveItemDisplay, .cartQuantityUpdate, .cartQuantity, #cartInstructionsDisplay, .cartTotalsDisplay {
padding: 0.5em 0em;
}

.cartUnitDisplay, .cartTotalDisplay {
text-align: right;
padding-right: 0.2em;
}

#scUpdateQuantity {
width: 2em;
}

.cartQuantity {
width: 4.7em;
}

.cartNewItem {
color: #404040;
position: relative; /*do not remove-fixes stupid IEbug*/
}

.cartOldItem {
color: #404040;
position: relative; /*do not remove-fixes stupid IEbug*/
}

.cartBoxTotal {
text-align: right;
font-weight: bold;
}

.cartRemoveItemDisplay {
width: 3.5em;
}

.cartAttribsList {
margin-left: 1em;
}

#mediaManager {
width: 50%;
margin: 0.2em;
padding: 0.5em;
}
.mediaTitle {
float: left;
}
.mediaTypeLink {
float: right;
}

.normalprice, .productSpecialPriceSale {
text-decoration: line-through;
}

.productSpecialPrice, .productSalePrice, .productSpecialPriceSale, .productPriceDiscount {
color: #404040;
}

.orderHistList {
margin: 1em;
padding: 0.2em 0em;
}

#cartBoxListWrapper ul, #ezPageBoxList ul {
list-style-type: none;
}

#cartBoxListWrapper li, #ezPageBoxList li, .cartBoxTotal {
margin: 0;
padding: 0.2em 0em;
}

#cartBoxEmpty, #cartBoxVoucherBalance {
font-weight: bold;
}

.totalBox {
width: 5.5em;
text-align: right;
padding: 0.2em;
}

.lineTitle, .amount {
text-align: right;
padding: 0.2em;
}

.amount {
width: 5.5em;
}

/*Image Display*/
#productMainImage, #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage {
margin: 0em 1em 1em 0em ;
}

.categoryIcon {}

#cartImage {
margin: 0.5em 1em;
}

/*Attributes*/
.attribImg {
width: 20%;
margin: 0.3em 0em;
}

.attributesComments {}

/*list box contents*/
.centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew {
margin: 1em 0em;
}

/*sideboxes*/
.columnLeft {}

h3.leftBoxHeading, h3.leftBoxHeading a {
font-size: 1em;
color: #404040;
text-align:left;
}

.leftBoxHeading, .centerBoxHeading {
margin: 0em;
background-color: #;
padding: 0.5em 0.2em;
text-align:left;
}

.leftBoxContainer {
border: 1px solid #;
margin-top: 1.5em;
}

.sideBoxContent {
background-color: #;
padding: 0.4em;
text-align:left;
}

h3.rightBoxHeading, h3.rightBoxHeading a {
font-size: 1.1em;
color: #404040;
}

.rightBoxHeading {
margin: 0em;
background-color: #;
padding: 0.2em 0em;
}

h3.leftBoxHeading a:hover {
color: #79664B;
text-decoration: none;
}

h3.rightBoxHeading a:hover {
color: #79664B;
text-decoration: none;
}

.rightBoxContent {
background-color: #;
margin-bottom: 1em;
}

.centeredContent, TH, #cartEmptyText, #cartBoxGVButton, #cartBoxEmpty, #cartBoxVoucherBalance, #navCatTabsWrapper, #navEZPageNextPrev, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix, #siteinfoLegal, #siteinfoCredits, #siteinfoStatus, #siteinfoIP, .center, .cartRemoveItemDisplay, .cartQuantityUpdate, .cartQuantity, .cartTotalsDisplay, #cartBoxGVBalance, .leftBoxHeading, .centerBoxHeading,.rightBoxHeading, .productListing-data, .accountQuantityDisplay, .ratingRow, LABEL#textAreaReviews, #productMainImage, #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew, .gvBal, .attribImg {
text-align: center;
}

#bestsellers .wrapper {
margin: 0em 0em 0em 1.5em;
}

#bestsellers ol {
padding: 0;
margin-left: 1.1em;
}

#bestsellers li {
padding: 0;
margin: 0.3em 0em 0.3em 0em;
}

#bannerboxHeading {
background-color: #;
}

#upProductsHeading {
text-align: left;
}

#upDateHeading {
text-align: right;
}

/*misc*/
.back {
float: left;
}

.forward, #shoppingCartDefault #PPECbutton {
float: right;
}

.bold {
font-weight: bold;
}

.rowOdd {
background-color: #;
height: 1.5em;
vertical-align: top;
}

.rowEven {
background-color: #;
height: 1.5em;
vertical-align: top;
}

.hiddenField {
display: none;
}
.visibleField {
display: inline;
}

CAPTION {
/*display: none;*/
}

#myAccountGen li, #myAccountNotify li {
margin: 0;
}

.accountTotalDisplay, .accountTaxDisplay {
width: 20%;
text-align: right;
/*vertical-align: top*/
}

.accountQuantityDisplay {
width: 10%;
vertical-align: top
}

TR.tableHeading {
background-color: #;
height: 2em;
}

#siteMapList {
width: 90%;
float: right;
}

.ratingRow {
margin: 1em 0em 1.5em 0em;
}

LABEL#textAreaReviews {
font-weight: normal;
margin: 1em 0em;
}

#popupShippingEstimator, #popupSearchHelp, #popupAdditionalImage, #popupImage, #popupCVVHelp, #popupCouponHelp, #popupAtrribsQuantityPricesHelp, #infoShoppingCart {
background-color: #;
}
.information {padding: 10px 3px; line-height: 150%;}

#shoppingcartBody #shippingEstimatorContent {
clear: both;
}

.seDisplayedAddressLabel {
background-color:#;
text-align: center;
}
.seDisplayedAddressInfo {
text-transform: uppercase;
text-align: center;
font-weight: bold;
}
#seShipTo {
padding: 0.2em;
}

#productTellFriendLink {float: left; margin-top: -2.3em;}

/* bof Code for two-column Product Descriptions*/

#myProdWrapper{
width: 550px; /*Width of main product wrapper*/
margin: 0 auto; /*Center product wrapper on page*/
}

#myProdDescWrapper{
float: left;
width: 100%;
}

#MyProdDescText{
margin-left: 222px; /*Set left margin to product image width*/
}

#MyProdDescImg{
float: left;
width: 222px; /*Width of product image*/
margin-left: -550px; /*Set left margin to -(myProdWrapper Width)*/
}

/* eof Code for two-column Product Descriptions*/

[dbltoe]

add to the stylesheet:

#myProdWrapper p{
font-weight: normal;
text-align: justify;
}