Hi all,

First off, thanks for your time in advance, and also thanks for a great module!

Here's a link to illustrate the problem-

http://test.3photoshop.com/rainbow-video-tutorial-photoshop

I'm using views, panels, and CCK (all most recent versions) to build the pages. You'll see two panels with identical thumbnails at the top of the page, if you look at the first one, the text doesn't sit inline with the image. The text is a node body (or at least it will be, at the moment it's just some global custom text), and the image is generated via Imagefield through CCK. The panel is put together using a view, but no matter how hard I try, I just can't get the text to sit inline with the image. I've raised the question on a views support thread but am told that it is to do with the way the Imagefield object is displayed (using the <p> tag possibly. Here's a link to the other thread to give you some more background on what's going on (you can see my post at the bottom)-

http://drupal.org/node/324179

The lower panel is created by adding the thumbnail to the body field inside the node. Not ideal as it creates way more work than is needed, but this is how I would love the final solution to work.

Is there an way around this problem, it's going to save me loads of time if I can get it sorted out.

Any help or pointers would be greatly appreciated.

Many thanks

Matt

Comments

quicksketch’s picture

quicksketch
he/him
commented

Looks like you can accomplish what you want by adding the following to your style.css file:

.views-field-field-vid-thumb-fid {
  float: left;
}

The reason the text isn't wrapping around isn't because of the <img> tag, it's actually the span around the image that's preventing the text from wrapping properly.

Also, it looks like you've got your image double-wrapped in <a></a> tags. It looks like you might be using "thumbnail linked to node" as the formatter AND checking the "Link to node" box within Views. You should really only use one or the other to prevent such double-wrapping.

Note: I edited your post and inserted <code> tags around your <p> tag so that it would show up in the display.

mattyboy’s picture

mattyboy commented

Hey quicksketch ,

Thanks so much for your help, I was playing around with the CSS for about 7 hours last night, and you've solved my problem in 5 minutes. Thanks for wrapping my example code in code tags, I'll keep that in mind for next time.

I added the CSS you wrote to my local content file and things now work perfectly, I also fixed the problem with the double wrapping with <a></a> tags by turning off the 'thumbnail linked to node' option as suggested.

I also love the five star module which you co-authored and maintain, so you might hear from me on those support pages at some stage in the futute!

Thanks again for help

Matt

quicksketch’s picture

quicksketch
he/him
commented
Status: Active » Fixed

Great, thanks for the followup.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.