绝对位置无法正常工作屏幕分辨率更改和窗口大小更改

时间:2014-02-19 10:17:25

标签: html css

请参阅以下代码

<div style="position: relative;">
    <div style="position: absolute; left: 10px; top: 18px;">
        <img id="ImgTachoMetre" src="/Images/u174_normal.png">
    </div>
</div>

我已完成上述编码,用于在页面的某个所需位置对div元素进行定位。

但是当我在不同的分辨率上测试它时,它不对齐。当我最大化或最小化窗口时,它也不合时宜。

用谷歌搜索并在下面的链接中找到类似的问题

CSS position: absolute screen resolution problem

但该解决方案也不适用于我。

我们如何解决?

谢谢,

1 个答案:

答案 0 :(得分:0)

在css中使用@media only屏幕。

<div class="container-style">
<div class="mystyle">
    <img id="ImgTachoMetre" src="/Images/u174_normal.png">
</div>

参考此链接 - &gt; http://css-tricks.com/snippets/css/media-queries-for-standard-devices/

@media only screen 
and (min-width : 1224px){

.container-style{
 /* Styles */
                }
.mystyle{
 /* Styles */
        }
}




@media only screen 
and (max-width : 1224px){

.container-style{
 /* Styles */
                }
.mystyle{
 /* Styles */
        }
}