Hello, I'm working on a website and in 2 cases there are problems with the node title not wrapping appropriately (both are views using the Bonus Pack's Grid View for display):

  1. http://blendapparel.com/products
  2. http://blendapparel.com/gallery-test

1: You can see in the last row of the 1st column, the title ("That's What She Said") won't wrap to 2 lines. This forces the column to be wider than it needs to be, pushing the next column over too far.

2: The same thing is happening on every row in the middle column. The difference is that the *other* columns' titles are wrapping without any problem.

I have tried, with the help of Firebug and "CSS Edit", to find a way to fix this. It appears the div class is "view-field view-data-node_title". But I can't find any way to make this class recognize the size of the image it's associated with and wrap accordingly.

I'm surprised this hasn't come up for someone else, and would be very appreciative of any help you could provide!

Thanks,

Jim

Comments

webmasterkai’s picture

webmasterkai commented
Status: Active » Closed (fixed)

You just need to give the title div a width the same as the image. If the image is 100px wide the title needs to be given a width of 100px. For example:

.view-products td.view-grid-item .view-data-node_title {width:100px;}

jimmb’s picture

jimmb commented

thanks!