Positioning Thumbnails in Categories

Store UI, layout, design, look and feel; Discussion on the customer facing pages of your online store. Cascading Style Sheets, Themes, Scriptlets, NVelocity and the components in the ConLib directory.
Post Reply
smcfarland
Lieutenant, Jr. Grade (LT JG)
Lieutenant, Jr. Grade (LT JG)
Posts: 26
Joined: Fri Oct 17, 2008 4:25 pm

Positioning Thumbnails in Categories

Post by smcfarland » Tue Oct 21, 2008 2:31 pm

I searched for this in the forums but didn't see anything.

Where do you change the alignment for the thumbnails in the category? If I look at the code on the page, it says:

Code: Select all

<td align="center" class="tableNode" style="width: 33%;" valign="bottom">
However, in the CSS, there is nothing specifying the vertical-align:bottom -- I have looked everywhere. Am I missing something?

Thanks.

User avatar
ryanstowasser
Lieutenant Commander (LCDR)
Lieutenant Commander (LCDR)
Posts: 90
Joined: Tue Oct 30, 2007 4:28 pm
Contact:

Re: Positioning Thumbnails in Categories

Post by ryanstowasser » Tue Oct 21, 2008 3:49 pm

change valign="bottom" to valign="top"

that will do it if there is nothing in the css

smcfarland
Lieutenant, Jr. Grade (LT JG)
Lieutenant, Jr. Grade (LT JG)
Posts: 26
Joined: Fri Oct 17, 2008 4:25 pm

Re: Positioning Thumbnails in Categories

Post by smcfarland » Tue Oct 21, 2008 6:14 pm

I just can't find the file anywhere...

I looked in all the css, the layouts, and all the main category pages in the root.

User avatar
mazhar
Master Yoda
Master Yoda
Posts: 5084
Joined: Wed Jul 09, 2008 8:21 am
Contact:

Re: Positioning Thumbnails in Categories

Post by mazhar » Wed Oct 22, 2008 6:59 am

Make this change in the ASPX file code not in CSS as mentioned by ryanstowasser.

smcfarland
Lieutenant, Jr. Grade (LT JG)
Lieutenant, Jr. Grade (LT JG)
Posts: 26
Joined: Fri Oct 17, 2008 4:25 pm

Re: Positioning Thumbnails in Categories

Post by smcfarland » Wed Oct 22, 2008 8:26 am

I changed it in CategoryGridPage3, which is where the code was located, but it didn't make the change.

It is a pet peeve of mine for the images not to line up because there are different lines of text for the product - looks disorganized. I will try to find a way to work around it.

User avatar
mazhar
Master Yoda
Master Yoda
Posts: 5084
Joined: Wed Jul 09, 2008 8:21 am
Contact:

Re: Positioning Thumbnails in Categories

Post by mazhar » Wed Oct 22, 2008 8:51 am

On the CategoryGridPage3 I think you need to modify the following statement

Code: Select all

<ItemStyle HorizontalAlign="center" VerticalAlign="middle" Width="33%" CssClass="tableNode" />
Change its vertical align property to your desired for example Top etc.

smcfarland
Lieutenant, Jr. Grade (LT JG)
Lieutenant, Jr. Grade (LT JG)
Posts: 26
Joined: Fri Oct 17, 2008 4:25 pm

Re: Positioning Thumbnails in Categories

Post by smcfarland » Wed Oct 22, 2008 11:25 am

Looking at the source code, I have:

Code: Select all

<td class="tableNode" align="center" valign="top" style="width:33%;">
It should be right (err, top), but it isn't.

User avatar
mazhar
Master Yoda
Master Yoda
Posts: 5084
Joined: Wed Jul 09, 2008 8:21 am
Contact:

Re: Positioning Thumbnails in Categories

Post by mazhar » Wed Oct 22, 2008 11:34 am

I suggested the change in ConLib/CategoryGridPage3.ascx file. Are you looking in the same file or some different one?

smcfarland
Lieutenant, Jr. Grade (LT JG)
Lieutenant, Jr. Grade (LT JG)
Posts: 26
Joined: Fri Oct 17, 2008 4:25 pm

Re: Positioning Thumbnails in Categories

Post by smcfarland » Wed Oct 22, 2008 11:37 am

For anyone else looking for this, I changed it there (categories pages), but it also needed to be changed in the styles.css:

Code: Select all

/* node in the catalog display - used in table layouts */
.catalog .tableNode {  vertical-align:top;}
It was not in the first stylesheet I was looking in, but it is in the one I am using now.

Post Reply