Adjust image width for all images

By default, KnowledgeOwl sets images to have a max-width of 100%. This means that images are displayed at actual size but can never be wider than your article--they're automatically resized to fit within the article. Here's an image with the default 100% max-width:

If you'd like to keep images automatically smaller than 100% width on all screens/devices, we recommend adding some Custom CSS to set that max-width to a different percentage. Using a percentage helps keep the images responsive to fit on any screen size or device.

To make this adjustment:

1. Go to Settings > Style.
2. Below the preview pane, click on the Custom CSS tab.
3. Copy this code. If you want a max-width other than 70%, adjust the percentage accordingly:

   .img-responsive {
        max-width: 70%;
   }

4. Be sure to Save your changes.
   Your code should look something like this:
   Sample Custom CSS setting max-width of responsive images to 70%

Now the same image is only 70% of the width of the article:

You can increase or decrease the percentage for the desired size, and this will apply to all images in your articles.