Height of archives

herdsherdsherds · Member · Nov 28, 2021 at 1:42 pm
Copy link

Add topic to favorites
Hello!

On my blog’s home the box posts has different heights, and I want to fix this. This image will illustrate what I want to change: https://cafecomite.files.wordpress.com/2021/11/post-archives.png

And sometimes I use a photo with portrait dimensions as featured image. In this case, I want the CSS to cut the image, so the pic will be the same dimensions of the others. This image will illustrate what I want to change:

Can you guys help me?

The blog I need help with is: (visible only to logged in users)
melviinkhoo · Member · Nov 28, 2021 at 5:30 pm
Copy link
Hi there,

I do find that the issue with the different heights on your first question is due to the different lengths of your post title and post description. If you are using the Blog Post block, you can control the number of characters in the excerpt to reduce the height issue. (However, you won’t be able to limit the number of characters in the title.)

I’ve put together a CSS customization for you to refer to. It should control the image height, title height, and description height. You could change the height on your own if the numbers that I recommended are not working for you. The bad thing about the custom CSS below is, it will hide any additional characters in the title, description, or image.
```
.entry-content{
  height:50px;
  overflow: hidden;
}

.entry-title{
  height:50px;
  overflow: hidden;
}

.featured-image{
    height:300px;
  overflow: hidden;
}
```
Hope this is what you are looking for.
herdsherdsherds · Member · Nov 28, 2021 at 5:48 pm
Copy link
Hi, mel!
Your code worked very well on my second issue. The first one is still there. I’ve been trying to fix this, but I’m not getting it :(((
herdsherdsherds · Member · Nov 28, 2021 at 6:11 pm
Copy link
Wow, I think I got i???
melviinkhoo · Member · Nov 29, 2021 at 6:43 am
Copy link
Hi @herdsherdsherds,

By right, the customized CSS code (.entry-title and .entry-content) could solve your first issue. But you will need to play around with the numbers if the 50px doesn’t suit all your posts :)

Another better workaround is to limit your character number in the excerpt, as I mentioned in my previous post.

No items found.