Tôi gặp sự cố với tính năng kiểm soát mặt nạ sẽ không đạt được độ cao 100% trong chrome. Nó hoạt động tốt trong FF. Im sử dụngchiều cao 100% trong chrome
html, body {
padding: 0px;
width: 100%;
height: 100%;
}
#div {
min-height: 100%;
}
Tại sao lại như vậy?
này hoạt động hoàn hảo cho tôi trên mọi trình duyệt:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>min-height test</title>
<style type="text/css">
html, body { padding: 0px; margin: 0px; width: 100%; height: 100%; }
#div { min-height: 100%; background-color: gray; }
</style>
</head>
<body>
<div id="div">test</div>
</body>
</html>
Bạn có thể cung cấp thêm chi tiết?
Sửa
Dưới đây là phiên bản cập nhật dựa trên các thông tin được cung cấp:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>min-height test</title>
<style type="text/css">
html, body { padding: 0px; margin: 0px; height: 100%; text-align: center; }
.contents { height: 100%; width: 780px; margin-left: auto;
margin-right: auto; text-align: left; }
#right { float: left; width: 217px; min-height: 100%; background:#4b805b; }
</style>
</head>
<body>
<div class="contents">
<div id="right">test</div>
</div>
</body>
</html>
Tuy nhiên tất cả mọi thứ có vẻ tốt đẹp dành cho Chrome, Firefox và IE8
tôi không biết những gì khác để thêm này là tất cả các css của container // tôi thực sự không biết làm thế nào để định dạng mã cho câu chuyện STACKOVERFLOW! #right { \t float: left; \t chiều rộng: 217px; \t chiều cao tối thiểu: 100%; \t \t nền: # 4b805b; } và đây là lỗ thân/html html, body { \t padding: 0px; \t lề: 0px; \t chiều cao: 100%; \t căn chỉnh văn bản: trung tâm; \t } nội dung { \t họ phông chữ: "Tahoma CE", "Arial CE", "Helvetica CE", Tahoma, Arial, lucida, sans-serif; \t kích thước phông chữ: 12px; \t nền: url (images/bk.jpg) lặp lại-x cố định; \t } – andrei
Vui lòng chỉnh sửa câu hỏi của bạn và cung cấp phiên bản rút gọn của html. Điều quan trọng là bố trí html của bạn, không phải CSS của bạn. – Diadistis
Tôi thực sự không thể làm điều đó, tôi đã không viết mã (mà là một btw mess) Tôi chỉ là trình gỡ rối (không thực tế là các bên được bao gồm thông qua php có cái gì để làm với điều này?) – andrei
Từ http://doctype.com/give-two-nested-divs-100-minheight:
Các phần tử con được thừa hưởng chiều cao của vùng chứa mẹ chỉ khi nó là quy định một cách rõ ràng. Nhưng chiều cao tối thiểu không phải là đặc điểm kỹ thuật rõ ràng của chiều cao , do đó chiều cao được tính là "tự động" chứ không phải 100%.
Ồ, vậy câu trả lời là đặt cả chiều cao ** ** và ** tối thiểu ** thành ** 100% **? Hoặc chỉ ** chiều cao ** và để lại ** chiều cao tối thiểu ** ra? – harpo
Bạn cần phải xác định cha mẹ của bạn với 100% chiều cao cũng như trẻ em như vậy
html,body{
height: 100%;
}
#div{
min-height: 100%;
height: auto !important;
height: 100%; /*for IE*/
}
Điều quan trọng sẽ ghi đè lên tất cả các quy tắc chiều cao khác. Hãy thử rằng bạn sẽ không có vấn đề gì.
Đã xảy ra sự cố tương tự, sự cố này đã được khắc phục. Ít nhất hãy thử nó. Không chắc tại sao đột nhiên tôi lại gặp vấn đề này khi tôi không ở trước đây. – Kirk
Kiểm tra với mã Dưới đây, làm việc và in ấn nhãn tốt cho tôi dưới máy in Zebra GC420d nhãn:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8">
<style type="text/css">
html, body { padding: 0px; margin: 0px; width: 100%; height: 100%; }
#div { min-height: 100%; }
</style>
</head>
<body>
<div style="border: 0px solid red;">
<table border="0" width="100%" align="center">
<tr>
<td style="text-align: center;">
<?php
echo $name;
?>
</td>
</tr>
<tr><td></td></tr>
<tr>
<td style="text-align: center;">
<?php
echo 'https://goo.gl/2QvRXf';
?>
</td>
</tr>
</table>
</div>
</body>
</html>
Hy vọng nó sẽ giúp!
Bạn không thể chỉ định kích thước của html và nội dung. html thậm chí không phải là phần tử hiển thị và nội dung chứa TẤT CẢ các phần tử hiển thị –
@Jamie Wong: Không đúng, nếu bạn không chỉ định html và nội dung bạn không thể nhận được 100% chiều cao – Diadistis
@Diadistis Sai Tôi - http://www.webmasterworld.com/forum83/7559.htm để tham khảo –