我正在尝试调整 Dokuwiki 模板以供个人使用。我遇到的一个问题是,当我在 Android 的默认浏览器中访问它并缩放文本时,一些工具链接不在屏幕上——我必须反复滑动才能看到它们。尽管文本的其余部分在其增加的大小下可以很好地换行,并且它不使用绝对定位(它确实使用了固定定位,但只是垂直定位,我下面的演示根本没有)。
在 Chromium(和 Firefox)中,调整窗口或文本的大小不会将文本推到视野之外。
我已经整理了一个演示问题的最小示例。这是 XHTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xml:lang="en"
lang="en"
dir="ltr">
<head>
<title>test</title>
<link rel="stylesheet" href="./css_1.css" />
</head>
<body>
<h1>Heading</h1>
<div id="tools">
<ul>
<li>Menu Item</li>
</ul>
</div>
<p>
It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English.
</p>
</body>
</html>
...和CSS:
#tools {
float:right;
text-align:right;
margin-bottom:2.1em;
}
文本段落正常调整大小和换行,Menu Item
文本在缩放后最终离开屏幕。