Confluence: Responsive image height (not width)

I'm an editor on my company's Confluence account, so I don't have admin privileges. Is there a way, without obtaining admin privileges, to make it so that the height of images also changes responsively? For whatever reason, it's only the width that changes. The image editor only allows you to change the width and you can't change it to a percentage value. I've tried.

My code is set up as follows: The content is in a section and in two columns. The image is in a column with the width of 70%. I've had this same image problem even when the image is outside of a column. My page has a main content section and a right sidebar. 

I have my images set to the "large" resize setting, not original. 

I really want to edit the source code on my Confluence file, but I don't think I can without admin privileges. If that's the only way, I can see if I can ask to get them. 

Ideal display:

Screen Shot 2017-06-21 at 10.44.34 AM.pngResized/shrunk display:

Screen Shot 2017-06-21 at 10.45.06 AM.png

1 answer

0 vote

A couple of questions:

  1. What version of Confluence is this?
  2. What is the image type you are using?

One workaround for change the styling per page is to drop an HTML macro somewhere on the page, then you can drop in css similar to:

<style type="text/css">
.confluence-embedded-image {height: 100%;}
</style>

Note that this will target all embedded images on the page.  You can drop html macros above and below your image element to add in custom divs if you would like to very specifically target one element in one page.

To impact all images in aspace or instance, you will need to reach out to your admins.

 

 

Thanks for your response, @Stephanie Renfrow!

From what I can tell is that we have Confluence 1000.1711.1. 

I'm using a .jpg file. When I search macros, I only find HTML comments. 

Apologies, my answer was for Confluence server.

In Cloud, I was able to replicate the behavior you describe.  I will check to see if a bug request has been filed for this.  in the meantime, it does appear that original size images respond properly.

As a workaround, I recommend saving your image in the desired size, adding to the page, and setting to original.  You should see the desired responsive effect after that.

Suggest an answer

Log in or Sign up to answer
Atlassian Community Anniversary

Happy Anniversary, Atlassian Community!

This community is celebrating its one-year anniversary and Atlassian co-founder Mike Cannon-Brookes has all the feels.

Read more
Community showcase
Kesha Thillainayagam
Posted Apr 13, 2018 in Confluence

We want to hear how your non-technical teams are using Confluence!

Hi Community! Kesha (kay-sha) from the Confluence marketing team here! Can you share stories with us on how your non-technical (think Marketing, Sales, HR, legal, etc.) teams are using Confluen...

372 views 20 10
Join discussion

Atlassian User Groups

Connect with like-minded Atlassian users at free events near you!

Find a group

Connect with like-minded Atlassian users at free events near you!

Find my local user group

Unfortunately there are no AUG chapters near you at the moment.

Start an AUG

You're one step closer to meeting fellow Atlassian users at your local meet up. Learn more about AUGs

Groups near you