Full width image inside tabs

I have questions regarding tabs:

  1. I figure I can’t use Cornerstone element to add images inside a tab, correct? I can add an image using the editor only, correct?

  2. Is it possible then for images added this way to adjust themselves to full width of tabs and be responsive according to different devices? If it is not possible, how can I center an image inside a tab?

  3. Also how can I adjust the font size of the image captions?

  4. On mobile after first tab, other tabs are cut off. Anything I can do about this?

Thanks

  1. You could build Tab content in Cornerstone as a global block, then drop its shortcode into the a tab. (Remove spacings in the Global Block)

  2. Assuming your l/r Panel paddings are still 1.5rem, you could add this CSS to your Tab’s elemement CSS:

    $el img {
    margin-left: -1.5rem;
    max-width: calc(100% + 3rem);
    }

  3. Inspect it with dev tools, find the class (I think it is wp-caption), and change the font size:

    $el .wp-caption {
    font-size: 1.2em!important;
    }

  4. haven’t seen that…

Thank you, I managed using shortcodes and CSS

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