default image width #2

New issue

Closed

opened 2023-11-07 21:59:12 +00:00 by Squel · 1 comment

Squel commented

2023-11-07 21:59:12 +00:00

(Migrated from codeberg.org)

when using markdown ![](https://example.com/image.png) to add an image, rather than html <img src="https://example.com/image.png" width="100%", the image overflows if the resolution is too high.

this could fixed by adding the following to the global.css file, which fixes both markdown and html images.

img {
    width: 100%;
}

However, smaller images may get upscaled to the width of div#mainContent

when using markdown `![](https://example.com/image.png)` to add an image, rather than html `<img src="https://example.com/image.png" width="100%"`, the image overflows if the resolution is too high. this could fixed by adding the following to the `global.css` file, which fixes both markdown and html images. ```css img { width: 100%; } ``` However, smaller images may get upscaled to the width of `div#mainContent`

Squel commented

2023-12-09 00:39:17 +00:00

(Migrated from codeberg.org)

Fixed better by adding the following in Squeljur/website@b395a6b93e:

img {
    max-width: 100%;
}

Uses the default width of the image, or maxes out at the width of div#mainContent

Fixed better by adding the following in https://codeberg.org/Squeljur/website/commit/b395a6b93ed7824c31a79ece53ea19d5f6a060f9: ```css img { max-width: 100%; } ``` Uses the default width of the image, or maxes out at the width of div#mainContent

Commenting is not possible because the repository is archived.