在手机上使用 ssi 网页上的空白

Question

在我的网站 https://traunviertler-traunwalchen.de/ 上，在移动设备上显示时有很大的空白（使用 WindowsPhone 10 和 Android 测试）。我还在 Windows 上测试了 Firefox 和 Edge，在 Linux 上测试了 Firefox。在这种情况下，没有出现空格。
该网站使用 SSI 来包含菜单、顶部的 header 和一些元标记。由于使用 SSI，出现了这个空白。
所有 html 个页面均使用无 BOM 的 UTF-8 编码。
index.html:

<!DOCTYPE html>
<html lang="de">
    <head>
        <title>D&acute;Traunviertler Traunwalchen</title>
    </head>
    <body>
<!--#include virtual=/includes/body.shtml -->
        <main>
            <h1>A herzlichs Gria&szlig; God</h1>
            <figure id=logo>
                <img alt="Das GTEV Traunwalchen-Zeichen" src="/images/Design/logo400x343.png" />
                <figcaption>As GTEV D&acute;Traunviertler Traunwalchen Zoacha</figcaption>
            </figure>
...
        </main>
    </body>
</html>

body.shtml:

    <noscript>Um den vollen Funktionsumfang dieser Webseite zu erfahren, benötigen Sie JavaScript. Eine Anleitung wie Sie JavaScript in Ihrem Browser einschalten, befindet sich <a href="http://www.enable-javascript.com/de/" target="_blank">hier</a>.</noscript>
    <img src="https://www.browser-statistik.de/browser.png?style=0" alt="" />
    <script> 
        var $buoop = {vs:{i:13,f:-2,o:-2,s:9,c:-2},unsecure:true,api:4}; 
        function $buo_f(){ 
            var e = document.createElement("script"); 
            e.src = "//browser-update.org/update.min.js"; 
            document.body.appendChild(e);
        };
        try {document.addEventListener("DOMContentLoaded", $buo_f,false)}
        catch(e){window.attachEvent("onload", $buo_f)}
    </script>

Answer 1

有一张图片

https://www.browser-statistik.de/browser.png?style=0

在 noscript 标签之后，您的图片在移动设备上的宽度为 100%，这会导致问题。你实际上可以用 chrome 检查它，只需模拟

如果您可以控制该图像，则向其添加 class 并设置不同的样式，或者您也可以将其定位为

noscript + img {
    width: auto;
}

在手机上使用 ssi 网页上的空白

Whitespace on webpage using ssi on phones

html

ssi