Need spacing code help

I want to have a buy now button on all my products when the product are listed in each category, but some products show up with a combination of both the "more info" link and quantity box only and then other categories are listed showing the more info link and buy now links only depending on which list of products you are looking at.

For example, the all products category listing, or new products category listing or a specific product category listing. I hope this make sense. I have spent the last 6 hours looking for something in the forums but with no luck!

I also need help with a spacing issue. I want to add a space between the bullets in my individual product description and the product image. Right now, the bullets are overlapping into the image.

And one last thing, then I am done, I promise.... I want to move the short 150 character product description in the category listing to the right under the product name. It does this when I list the all kits category, but not for the new or all product listings.

Can anyone help?!?!

http://www.lauriesscraps.com/store

Do any of the products have attributes?
You can't get a buy now or add to cart button when a product has attributes; you need to go to the product info page to make choices before adding to cart.
Each kind of listing has its own layout controls.

Your <ul> is using the default "outside" list-style; you can change that to "inside" to move the bullest into the clear.
Add to your stylesheet

#productDescription ul {list-style: inside;}

I posted just a few days ago about changing the all listing descriptions to work similar to the product listing descriptions.
All product listing - moving the description text up?

gjh42:

Do any of the products have attributes?
You can't get a buy now or add to cart button when a product has attributes; you need to go to the product info page to make choices before adding to cart.
Each kind of listing has its own layout controls.

Your <ul> is using the default "outside" list-style; you can change that to "inside" to move the bullest into the clear.
Add to your stylesheet

#productDescription ul {list-style: inside;}

I posted just a few days ago about changing the all listing descriptions to work similar to the product listing descriptions.
All product listing - moving the description text up?

Which stylesheet do I go into to alter that code, changing it to inside? And is it the entire code you have listed above the code I need to add, or just alter from outside to inside...and where do i put it if I have to add the entire line of code?

**#productDescription ul {list-style: inside;}
**

I will take a look at the other thread. Thank you so much for your help. You have no idea how much I appreciate it!

Also, all of my products have attributes, but some have the "buy Now" button on the listing page and others do not. So I am not sure why it would be doing that if it is not supposed to because it has attributes. Could it be because there is only one attribute for the product so it shows the "buy now" button while others that have more than one attribute do not display the "buy now" button on the listing page?

Figured out the bullets issue, It was in my style sheet for my template (for everyone else knowledge).

includes/templates/my_template/css/

I pasted the code as such:

/Image Display/
#productMainImage, #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage {
margin: 0em 1em 1em 0em ;
}
#productDescription ul {list-style: inside;}

So now I just have that last question about the buy now on some and not others. thanks again!

I noticed one product that you said had the buy now button, did not actually have any attributes showing (even though it should have had the downloads button showing).

It has attributes now. I just added them, I guess I forgot to do that on 3 products. Good thing the store isn't live yet! But the "larger image" link is still showing on the bottom under the attributes, and not on the others.

I also noticed that this product has a huge gap in between the download attributes listed under the product image and description. I hope I didn't do something with the code, but that is odd that there is a gap!

I saw the "larger image" link under the main image on both products you mentioned before. Are you still talking about the "buy now"?

No, I figured that part out thanks to you, so THANK YOU! Sorry to be confusing. I was just wondering why some products show the "larger image" link and others don't.

Example:
http://www.lauriesscraps.com/store/index.php?main_page=product_info&cPath=65_75&products_id=205

http://www.lauriesscraps.com/store/index.php?main_page=product_info&cPath=67&products_id=234

And then after I altered that code for the description, I just noticed the huge gap in between attributes 1 and 2 listed below the product description. Not sure why that is. I was hoping you had some insight.

And not sure if this is possible, but can I get the description and all that product info to the right of the image on the all products listing page to center both vertically and horizontally?

Thanks for being a trooper and hanging in there with me. If it is any consolation... I am learning a ton!

THANK YOU AGAIN!

Both of those products show the "larger image" link for me (Firefox 3).

Add to your stylesheet

.productListing-odd .main, .productListing-even .main {vertical-align: middle;}

Note that the image itself is not centered in the product space, apparently because you have set the code in Configuration > All Listing to have two breaks after the image.

If you're concerned about the items in some description lists that drop below their bullets, that is because you have inserted <div> tags in those items. You don't want those.```
This Kit Contains:<br /><ul><li>7 Textured Pattern Papers</li><li>5 Textured Solid Papers</li><li><div>6 Bottlecaps</div></li>

gjh42:

Both of those products show the "larger image" link for me (Firefox 3).

Add to your stylesheet

.productListing-odd .main, .productListing-even .main {vertical-align: middle;}

Note that the image itself is not centered in the product space, apparently because you have set the code in Configuration > All Listing to have two breaks after the image.

Ya, I was trying to space it better, if I am sure on what you are meaning anyway.

I will try adding it and we shall see what happens.

Also, the "larger image" I am talking about is not under the larger main image, there is a smaller image listed at the bottom of the second link listed. I am not sure why it is there, it is listed right above the bottom "home" link.

I fixed the bullets issue, you were right on with the outside/inside coding. So I am "good to go" on that issue, thank you!

I pasted this code right above the ".productListing-odd" coding as such and IT WORKED:

.productListing-even {
background-color: #ffffff;
}

.productListing-odd .main, .productListing-even .main {vertical-align: middle;text-align: center}

.productListing-odd {
background-color: #ffffff;
}

.productListing-heading {

Thank you so much for your help. I think that is all I had, other than the image issue, not really need to fix it, just wondering why it would be doing that, and wanting to make sure I didn't mess up coding or something. HTML is still new to me and PHP is a completely new thing. I appreciate your help. You have been great!

OK, one more question which I am sure is a completely easy fix. I just wanted to make the row of category links that appear above the images when you click on a category bigger. I have been looking for the code, but I think I have to add completely new code for it and not sure where to do that.

Thanks again,
:clap::bigups::yes::D

OK, that is an additional image, which you apparently didn't intend to use.
Your main image for the product is named LS_P365TemplateSet2.jpg; that is the file that the product "owns", and any image starting with that exact name will automatically be considered an additional image for the product. You need to delete LS_P365TemplateSet2CU.jpg, or if it belongs to another product, rename it and re-upload it for that product, avoiding conflicting names.

"row of category links"? Do you mean the "Kits Quick Pages Layout Templates Commercial Use"?
For those, find this in your stylesheet

#navMain ul li a, #navSupp ul li a, #navCatTabs ul li a {
	text-decoration: none;
	padding: 0em 0.5em;
	margin: 0;
	color: #000000;
	}
```and add below it```
#navCatTabs ul li a {font-size: 1.3em;}

If you mean something else, you'll have to explain in more detail.

No, I mean the category links such as All Kits, Boy, Girl, Seasonal, etc.

For those, you want to add to your stylesheet

.categoryListBoxContents {font-size: 1.3em;}

gjh42:

For those, you want to add to your stylesheet

.categoryListBoxContents {font-size: 1.3em;}

THANK YOU, THANK YOU, THANK YOU! That is all I needed. You have been absolutely amazing! Thank you so much! I can't believe I am actually done with all the customizing.

If I haven't said it enough, Thank you!

:bigups::clap::bigups::clap::bigups::clap::bigups:

OK, I didn't want to bother you again, but this is just bothering me and I can't figure it out, I am almost there, but just can't get it completely. When you click on a category, you can see the images listed below the category links that were mentioned already. They are all set to align left and I would like them to be centered. I can't find the code for that.

Can you help? (I would totally understand if you didn't want to, hehehe) But please!?!