Site logo

Archived topic

Want to add "Medically Reviewed By" near top of article

21 replies · Started by Rob on July 2, 2019

Viewing posts 16–22 of 22

Don't use the previous CSS and try this instead:

.page-hero.reviewedby .image {
    display: flex;
    justify-content: center;
    align-items: center;
}

Hey Leo,

Thank you. Here's what this looks like:

https://imgur.com/Ga5oQr1

My concerns are:

(1) This side-by-side view holds for mobile as well. I just want this view for desktop-only, and for the images to otherwise be stacked.

(2) There doesn't seem to be any spacing between the text and image, or the "|" bar present.

Here's a crude version of what I'm hoping this to look like:

https://imgur.com/JFTNs66

If this isn't possible, I don't want to keep leading you in circles. And thanks for all of your help so far.

Best,
Rob

Try adding this as well:

@media (max-width: 768px) {
    .page-hero.reviewedby .image {
        flex-direction: column;
    }
}
@media (min-width: 769px) {
    .page-hero.reviewedby .image img {
        border-left: 1px solid #fff;
        padding-left: 20px;
    }
    .page-hero.reviewedby .image h4 {
        padding-right: 20px;
    }
}

It's working!!

Thanks for your help and patience Leo. This looks great. Thanks again!!

No problem :)

Hi Rob,

How you did this, can you please guide me step by step?

Hi Sagar,

I'm guessing that there is a better solution now with the help of dynamic content.

Can you open a new topic for your question?

Thanks :)

This archived topic is closed to new replies.