Link Block throws a row's vertical alignment off

In the “client section”, I want some of the logos to be links and some to not be. I want to add a rollover to the logos that link to another page. When I add the link blocks into my rows of logos, it throws off the vertical alignment I had going. I can’t seem to find any built in padding or margins in the link block. Any idea what could be causing this?

Hi @sarastrese, This may have to do with the display property, however I’m not 100% sure without having access to your read only link.

Can you please share it here? Share a read-only link | Webflow University

Thanks in advance! :slight_smile:

Sorry, here it is:

https://preview.webflow.com/preview/delevantecreative?preview=4538200cb061c0e46ea60c9b6d06cff3

@thewonglv were you able to find anything from the read-only link I sent?

Hi @sarastrese, empty elements have a baseline that is different than elements with an image inside it.

It’s sort of a strange concept, but display: inline-block has vertical alignment settings that rely on the element’s “baseline” More info here: html - Why does this inline-block element have content that is not vertically aligned - Stack Overflow

What I would do? I would continue to use images and avoid using background images. This will help your site be more responsive as is easier to manage.

Try adding your images to the link block and remove the height and width settings.

Hope this helps! :slight_smile:

Thanks @thewonglv. I would love to keep all the logos as images, but wasn’t able to find a way to achieve the rollover I need, i.e. the gray logo turns to the full color logo?

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.