Tweak CSS to enlarge thumbnail

Image keeps overlapping title of post

[sdari]

I'm trying to enlarge the current thumb on the homepage from 100x70 to say 150x115. The problem is that the enlarged thumb overlaps the adjacent title of the post. I want the thumb to enlarge and the title text to wrap around the thumb. It's supposed to be simple, but I'm out of tries.

[edited by: not2easy at 3:15 pm (utc) on Mar 17, 2016]
[edit reason] TOS compliance [/edit]

[not2easy]

Hello sdari and welcome to the forums. If you can share the code you are trying to work with you can get help to resolve the problem.

In general the size of an image is controlled by the size of the container <div> it is in and by the size of the actual image and by the css attributes for the image and for the container.

[sdari]

Thank you @not2easy. This is the code I'm trying to work with. I try to change the image dimensions from 100x70 to 150x115 but then it overlaps the title and comes out of the block/module.

<div class="td-module-thumb"><a href="https://www.example.com/page/" rel="bookmark" title="example"><img width="100" height="70" class="entry-thumb td-animation-stack-type0-1" src="https://www.example.com/wp-content/uploads/2016/03/9-100x70.jpg" alt="" title="example"></a></div>

[edited by: not2easy at 5:59 pm (utc) on Mar 17, 2016]
[edit reason] TOS/charter compliance [/edit]

[not2easy]

And the css you are using, can you share that as well? I don't see the html that surrounds this div with the image and the container with both the image and title element that is being overlapped.

[sdari]

@not2easy I started thinking and tinkering with container and attributes like you said, and the thing is, when you enlarge the image, everything else cannot just adjust "itself", which makes coding sense. I'll stick with this theme for now and if a need arises, will get a developer.