[Resolved] Category and Tags Archive Post Title Alignment

[Rohan Verma]

Hi.

In the category and tags archive pages, post titles are not aligned properly. Homepage is fine.

Check the screenshot: https://prnt.sc/u44skf

Pretty weird. On every archive page, only one is mis-aligned.

[David]

Hi there,

you have used CSS Grid template areas to create that layout.
But you have not specified any column widths, so they will resize to the width of their content. So short titles will take up less space.

Try changing your CSS to this:

.archive .inside-article {
    display: grid;
    grid-template-areas: 
                        "image content"
                        "image footer-meta";
    grid-template-columns: 200px 1fr;
}

[Rohan Verma]

Hi, David.

Still, some of the short titles are not aligned.

Which value need to increase or decrease? Or can you check again what’s the condition now…

[David]

What i can see – they look fine to me.

200px = the image area width
1fr = 1 fraction, which will automatically fill any space available to it.

[Rohan Verma]

Yes. Thanks. It seems working now.

[David]

You’re welcome

[Author]

Posts