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, add 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 Customize > Style (HTML & CSS).
2. In the Custom HTML, CSS, and JS section, select Custom CSS.
3. Copy the code below and paste it into your Custom CSS pane:

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

4. Adjust the max-width percentage in row 2 to whatever percentage you'd like.
5. Be sure to Save your changes.

Now all images set to "auto" width should match the CSS you entered. Here, for example, is is only 70% of the width of the article:

If you want to get very fancy, @media rules can let you set a different default depending on device/screen size.