Question

我有两个关于绝对定位和百分比的问题。我有一个大的背景图像，旨在使整个屏幕上的文字和图像覆盖图像。这些问题出现在所有Firefox，IE和Chrome上。（稍微缩写）代码如下所示，但这是我的两个问题：

图像显示在所有屏幕上的正确位置，与尺寸无关，但显示在iPad上的错误位置。 iPad是否会以不同的方式处理绝对定位和百分比，如果是这样，我该如何解决它？
链接文本四处移动，并且不会与我更改屏幕大小保持相同的位置，同样在iPad上完全错误。我需要做什么才能完全独立于屏幕大小定位文本，甚至不需要在iPad上定位？

代码如下：

    <div id='container'>
    <img src="big image"/> 
    <div id="link1"><a href="page1">menu</a></div>
    <div id="link2"><a href="page2">page2</a></div>
    <div id="button1"><a href="page3"><img src="Images/info.png"/></a></div>
    <div id="button2"><a href="page4"><img src="Images/expertise.png" /></a></div>

和CSS如下：

    #container {
    border: 0px 0px 0px 0px;
    margin-left: auto;
    margin-right: auto; }

    #link1, #link1 a {
    z-index: 10;
    position: absolute;
    margin-left: 59%;
    margin-top: 37%;
    font-size: xx-large;
    font-family: Arial, sans-serif;
    color: #000000;
    text-decoration: none;
    font-style:bold; }

    #link2, #link2 a { similar to link1 }

    #button1, #button1 a {
    z-index: 25;
    position: absolute;
    margin-left: 20.8%;
    margin-top: 57.2%;
    width: 16%; }

    #button2, #button2 a { similar to button1 }

绝对定位和百分比

0 个答案: