remove unwanted image padding and don't push well positioned anchors

[qjebbs]

The PR does two aspect of works:

1. remove unwanted padding for scaled down images

   Large images (.single .content img) will be scaled down according to the style max-width: 100%.

   For example, when a 1400*1400px image is scaled to 700px, the height is still 1400px according to the element property of height=1400 , which leaves unwanted huge padding on the top & bottom of the image.

   The PR tries to add height: auto; to fix it.

2. don't push well positioned anchors

   With the height: auto; style, the height of the image is not fixed after the execution of lazysizes library, which pushes well positioned anchors up or down right after the page is loaded & scrolled.

   the problem still exists without the height: auto; style, for example, the image is from the internet and has no width/height set, the anchor is very likely to be pushed down after the image loaded.

   The problem is caused by lazysizes lib, but we don't need it in most cases while we writing code like ![](example.png).

   To avoid the problem, the PR choose to not activate lazysizes if we don't have multiple images for responsive usage.

[sonarcloud[bot]]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
0.0% Duplication

[qjebbs]

This PR fixes #733

[sonarcloud[bot]]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
0.0% Duplication