Home >Web Front-end >HTML Tutorial >How to implement height:100%;width:100%; 10px around, and the clientheight of the parent div remains unchanged under IE6, urgent_html/css_WEB-ITnose
How to implement height:100%;width:100%; 10px around, and the clientheight of the parent div remains unchanged under IE6, urgent_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 12:11:051047browse
IE6下怎么实现height:100%;width:100%;四周空10px，父div的clientheight不变，急!!!!
b585974ae3b7dba3039af53a9593f9c4
383eb734b02b508089ba2d78eb4c6f68
93f0f5c25f18dab9d176bd4f6de5d30e
0f3eabac747cdf61a51589c5584ae6e8
b2386ffb911b14667cb8f0f91ea547a7无标题文档6e916e0f7d1e588d4f442bf645aedb2f
c9ccee2e6ea535a969eb3f532ad9fe89
*{margin:0px;padding:0px}
.div1{width:300px;height:300px;background:#aacc00;}
.div2{background:#aaccff;}
/*---------IE7/IE8其他浏览器-------------*/
/*
.div1{position:relative}
.div2{position:absolute;top:20px;left:20px;right:20px;bottom:20px;}
*/
/*---------IE6-------------*/
.div1{_padding:20px;}
.div2{_height:100%;
531ac245ce3e4fe3d50054a55f265927
9c3bca370b5104690d9ef395f2c5f8d1
6c04bd5ca3fcae76e30b72ad730ca86d
8a4a534d75f1e59067b19e1a5be6fbfb
f7dd17b641c71717fc22492d2ad6417cdfd16b28748ea4df4d9c2150843fecfba68
16b28748ea4df4d9c2150843fecfba68
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e
Reply to discussion (solution)
<!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 http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档 </title> <style> *{margin:0px;padding:0px} .div1{width:300px;height:300px;background:#aacc00;} .div2{background:#aaccff;} /*---------IE7/IE8其他浏览器-------------*/ .div1{position:relative} .div2{position:absolute;top:20px;left:20px;right:20px;bottom:20px;} /*---------IE6-------------*/ .div1{_padding:20px;} .div2{_height:expression(div1.clientHeight-40);_width:100%;}</style> </head> <body> <div class="div1" id="div1"> <div class="div2">dfd </div> </div> </body> </html> The upstairs is very comprehensive
If your div1 has a knowable width and height, then you can do this
.div1 { width:260px; height:260px; padding:20px; background:#aacc00; }
.div2 { height:100%; background:#aaccff; }
If the content of div2 may be higher than the specified height, you may also need to cooperate with overflow .
Also, when you have
55f76bf9771f9659ae0bff3e12b55ed7
, there is no need to write styles separately for ie6
Refer to the method given above
Haha. Take a look.
JF
The network is finally connected. I have been looking forward to your answers for a long time.
Thank you very much hookee and ddcatlee;
Because the height of the div is unknown, I borrowed hookee’s answer. , the problem is solved,
I still need to reply!
Do you want the reply to be visible?
b046eccc1ff07e9cbb558a84c01d8059
25d35076a35a4170be3151c2eb4587e9
68ccb177a5de0ef9542dde7d35bae727
Human Source Code (www.lrcode.com)6e916e0f7d1e588d4f442bf645aedb2f
4ec11beb6c39d0703d1751d203c17053
//Run the code
function runEx(cod1) {
cod= document.getElementById(cod1)
var code=cod.value;
if (code!=""){
var newwin=window.open('','','');
newwin.opener = null
newwin.document.write(code); function runCode(obj) {
var winname = window.open('', "_blank", '');
winname.document.open('text/html', 'replace');
winname.opener = null // Prevent code pairing Discussion page modifications 🎜> 6c04bd5ca3fcae76e30b72ad730ca86d
21679bcdc005c811dace94e33f2668374a249f0d628e2318394fd9b75b4636b1Lazy source code welcomes you473f0a7621bec819994bb5020d29372a
28da17b941fd09c31b00c7136428a042
41ae37f308318b653e43ed7c5dc8d5b8
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e