How to insert an attached image into a DIV from a javascript function and set the size

Community Help
4

Note that you can pass any attribute to FileAttachment.image(), for example

FileAttachment("1.jpeg").image({width: 100})

To insert a FileAttachment inside your text, use

some text

${ await FileAttachment("1.jpeg").image({width: 100, style: "max-width:640px"}) }

some more text

But I would suggest that you set the image width globally instead, by adding an HTML cell to your notebook with the following content:

<style>
  img { max-width: 640px }
</style>

Please also note that notebook cells are displayed inside the notebook’s <body>, so you cannot use elements like <HTML>, <HEAD> or <BODY> again.

If I may, I’d also suggest to switch from HTML cells to Markdown cells, which will offer a much friendlier editing experience. Instead of

    <B>1</B>

    <p>Sophia sat in her garage workshop, surrounded by piles of scraps and spare parts. She was a brilliant inventor and dreamer, but no one seemed to appreciate or understand her.</p>
   
    <BR>
    <p>At school, she was always getting into trouble for daydreaming and ignoring her lessons. And at home, her parents were always nagging her to help with chores and take care of her younger siblings.</p>

you’d only have to write

## 1

Sophia sat in her garage workshop, surrounded by piles of scraps and spare parts. She was a brilliant inventor and dreamer, but no one seemed to appreciate or understand her.
   
At school, she was always getting into trouble for daydreaming and ignoring her lessons. And at home, her parents were always nagging her to help with chores and take care of her younger siblings.

(similar to what you use here on the forum).