Sửa vị trí tuyệt đối trong Android

Question

Tôi có trang web của mình và nó trông tuyệt vời ở khắp mọi nơi tuy nhiên tôi không phải là một lập trình viên chuyên nghiệp cho Android. Tôi không biết những điều kỳ quặc mà nó có và tôi không chắc chắn là tôi cần phải biết nhiều. Có cách nào để tách nó ra như trong các bình luận có điều kiện cho IE không?

Here is my website và biểu ngữ và biểu tượng xuất hiện ở bên trái màn hình. Tôi có một Samsung Galaxy 3 và đây là những gì biểu ngữ của tôi trông giống như trên đó.

Bây giờ tôi nhận ra lý do tại sao điều này xảy ra, đó là vì họ đều hoàn toàn vị trí và rõ ràng các margin-left là làm cho nó đi ra khỏi màn hình. Tuy nhiên tôi không thể thay đổi điều đó mà không phá hủy bố cục cho tất cả các trình duyệt máy tính để bàn thông thường.

#site-title { background: url(img/heavensgate-logo.jpg) no-repeat; width: 229px;height: 297px; position: absolute; top: 0px; left: 50%; margin-left: -438px; z-index: 2; border: 0px; text-indent: -9999px; } 

#banner { position: absolute; top: 165px; width:868px; left: 50%; margin-left: -448px; z-index: 1; padding: 15px; background-color: 
#fff; border: 1px solid #b4b4b4; } 



<h1 id="site-title"><span><a href="http://heavensgatewinery.ca/" title="Heavens Gate Winery" rel="home">Heavens Gate Winery</a></span></h1> 

    <div id="banner"> 
    <img src="http://heavensgatewinery.ca/wp-content/uploads/banner8.jpg" style="position: absolute; visibility: hidden; top: 0px; left: 0px; border: 0px none;"> 
    </div> 

Tôi đang nhầm lẫn về cách làm việc với biểu ngữ và biểu trưng để hoạt động với Android. Bất kỳ trợ giúp được đánh giá cao.

Answer 1

Mặc dù đây không phải là vấn đề được mô tả ở đó, trình duyệt Android có vấn đề khác liên quan đến định vị tuyệt đối; DIV biến mất vị trí hoàn toàn. Giải pháp Paweł Komarnicki tìm thấy là -webkit-backface-visibility: hidden:

<div style="position: relative"> 
    <div style="position: absolute; -webkit-backface-visibility: hidden"> 
    </div> 
</div> 

Answer 2

Khi bạn cần định vị các phần tử có vị trí tuyệt đối, bạn hầu như luôn luôn làm như vậy bên trong phần tử vị trí tương đối.

<div style="position:relative;"><div style="position:absolute;"></div></div> 

Answer 3

Vấn đề của tôi là trong Android của tôi (Samsung) rằng trừ khi câu trả lời khác, bên trái: trong px cho đúng vị trí (tuyệt đối) nhưng trái: trong% đi đến vị trí 0 Ngay cả ví dụ bên trái: 10px; còn lại: 20%; chuyển đến vị trí 0, calc() không hoạt động ở bên trái :, nhưng hoạt động theo chiều rộng theo cách giới hạn.

Vì vậy, tôi nghĩ% không hoạt động cho bên trái: trong Android. Vì vậy, tôi nghĩ trong vấn đề trên còn lại: 50% là vấn đề, tôi tự hỏi nó đã được giải quyết với vị trí tương đối/tuyệt đối. Tôi đã làm như vậy nhưng không có giải pháp! Không có sự khác biệt nào khi sử dụng khả năng hiển thị -webkit-backface!

Giải pháp: thay cho trái: 17%, sử dụng trái: calc (17%) và px cố định khác cho bên trái: được lấy, nhưng% không hoạt động !!!