7
Tôi có một lỗi rất khác thường xuất hiện trên Android 4.0 trên Galaxy Note. Một số người bạn thấy giống nhau trên Galaxy S3 của họ. Tôi đã đơn giản hóa mã của mình như sau:Vị trí CSS Android: được sửa sau khi thiết bị xoay
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, maximum-scale=1.0,initial-scale=1.0, user-scalable=no" />
<style type="text/css">
#movieplayer {width:100%; position:fixed; top:0px; left:0px; right:0px; bottom:0; background:yellow; z-index: 90;}
.player, .project-info {width:100%}
#movieplayer .short-info {width:100%;background:green;display:block;position:relative;}
</style>
</head>
<body class="works">
<div id="global-container">
<div id="movieplayer">
<div class="player">
<div class="project-info movie">
<div class="short-info jspScrollable">
<div class="container">
hello
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Khi lần đầu tiên tải trang này trong PORTRAIT, bạn sẽ thấy thanh màu xanh lá cây trên nền màu vàng. Cả hai đều điền vào chiều rộng màn hình 100%. Khi bạn xoay điện thoại sang phong cảnh, màu vàng tiếp tục lấp đầy phần còn lại của màn hình, nhưng thanh màu xanh lá cây không lấp đầy chiều rộng còn lại. Tại sao điều này?
Tôi đang sử dụng #movieplayer {position: fixed;} tại đây vì trong mã thực sự của tôi, tôi dựa vào đó để thực hiện một số nội dung khác. Vì vậy, tôi không thể sử dụng vị trí: tuyệt đối.
Câu trả lời khác là cách tốt hơn và nó chỉ hoạt động! – Adaptabi
Đã sửa lỗi cho tôi. –