Resize Images

I like to have my images displayed inline at all times. I find this gives me more flexibility… if I ever want to have an image hidden in an outline I can just put it into a child bullet and then collapse the parent bullet.

One thing though is the image size… images often go way off my page like so:

I usually want images to fit the page. So 2 ideas for fixing this:

  1. Just make images fit the page each time (I’m have a feeling not everyone would be happy with this though)
  2. Make a little WYSIWYG draggy corner thing so you can drag the corner of the image to resize it

P.S. I am aware image resizing has been mentioned in a different thread, however in that thread neither of my two above fix ideas were mentioned or discussed, hence I’m making this thread. Sorry if that’s the wrong way to go about it!

2 Likes

I’d also like to see feature 2. Some pictures need to be shown large (for example those containing text/tables/etc) while smaller thumbnails would fit other situations better. In addition it would be great if those smaller pictures could be shown larger when hovered over. Like described here: Shrink down Markdown Imgur Images ![]() and IMAGE GALLERY. I use Dynalist on workplace PCs and I can’t install browser extensions etc. to do it like @Vincent_Tang does it in his blogpost above.

Is this kind of functionality possible?

Feature 1 I believe is already possible through custom CSS. I’m new to CSS but the following code seems to work well for me:

.node-displayed-image {
max-width: 60%;
}x

Stylistically, I also like to add a small shadow under each image:

.node-displayed-image {
max-width: 60%;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}