Forums / Templates, Stylesheets, Page Layout / Adjusting Text on the Product List

Adjusting Text on the Product List

Views: 677

Results 1 to 6 of 6
10 Jul 2012, 3:55 AM
#1
jhowe avatar

jhowe

New Zenner

Join Date:
Jul 2012
Posts:
16
Plugin Contributions:
0

Adjusting Text on the Product List

Hi guys,

Sorry if this seems simple.

On my page linked here:

http://banzaivapors.com/shop/index.php?main_page=index&cPath=1

I'm attempting to format my h3 text so that it sits closer to the top of the table with just a bit of padding. I'd also like to center the image in the div and tweak the description; intuitively I want to work with the CSS but any changes I make seem to alter much of the format. If anyone could guide me in the right direction I'd REALLY appreciate it. Thanks!

10 Jul 2012, 9:27 AM
#2
keneso avatar

keneso

Totally Zenned

Join Date:
May 2009
Posts:
1,273
Plugin Contributions:
3

Re: Adjusting Text on the Product List

Maybe change baseline to top

table, tr, th, td, tbody, tfoot, thead {
background: none repeat scroll 0 0 transparent;
margin: 0;
padding: 0;
vertical-align: baseline;
}

Get yourself firefox and firebug and/or webdeveloper extensions, so you can inspect the elements.

10 Jul 2012, 4:14 PM
#3
jhowe avatar

jhowe

New Zenner

Join Date:
Jul 2012
Posts:
16
Plugin Contributions:
0

Re: Adjusting Text on the Product List

Thank you for your reply; yeah I'm using both the styles editor and inspect tool from Firefox to mod my website. I think my problem is working with tables. I'm much more familiar with DIVs and don't know how to really configure or change table cell sizes or the existing DIVs inside the product list page.

Unfortunately the above suggestion didn't work. Using the inspect tool, all I would really like to do is pull the h3.itemTitle section further up td.productListing-data cell and have the description follow suit underneath.

As for the image titled img.listingProductImage, I'd like to center that in it's cell; I should be able to do that by either cutting the outside Div to the image's size or pushing the image further down in it's existing Div. What am I not considering or doing? I appreciate the help. Thanks again!

10 Jul 2012, 4:29 PM
#4
keneso avatar

keneso

Totally Zenned

Join Date:
May 2009
Posts:
1,273
Plugin Contributions:
3

Re: Adjusting Text on the Product List

I tried that in firebug, and it works; I just tried it again, and it works.
And I still see that on your stylesheet (line 27)
vertical-align: baseline;

I don't want to doubt about you having it done, but it sure doesn't look so on your site.

10 Jul 2012, 4:34 PM
#5
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Adjusting Text on the Product List

stylesheet.css (line 27)

table, tr, th, td, tbody, tfoot, thead {
background: none repeat scroll 0 0 transparent;
border: 0 none;
margin: 0;
padding: 0;
vertical-align: baseline;
}

Change baseline to middle or top and see what happens:) If it doesn't work for you, maybe you have a cache issue or are not getting the edit to apply...

10 Jul 2012, 7:10 PM
#6
jhowe avatar

jhowe

New Zenner

Join Date:
Jul 2012
Posts:
16
Plugin Contributions:
0

Re: Adjusting Text on the Product List

You guys are 100% correct. Sorry, I misunderstood your original post but this fixed the problem. Keneso, gjh42, you both are AWESOME! Thanks again!