这是我的网页DIV布局。所有内容都显示在midle DIV标签内。 midle div高度随mysql查询输出值自动更改。 我需要根据midle DIV高度来改变DIV nav1和nav2的高度。请建议。
.container {
position: relative;
}
nav2 {
position: absolute;
left: 0px;
width: 10%;
background-color:#3f3f3f;
margin-top:175px;
margin-bottom:0px;
height:100vh;
}
nav1 {
position: absolute;
right: 0px;
width: 10%;
background-color:#3f3f3f;
margin-top:175px;
height:100vh;
}
midle {
position:absolute;
top:236px;
left:10%;
right:10%;
bottom:20px;
height:auto;
}
// HTML页面
<head>
<title> INNOVogue </title>
</head>
<body>
<div class="container">
<header align="center">
<img src="logo.png" width="500" height="175"></header>
<nav2>
</nav2>
<nav1>
</nav1>
<midle>
<nav id="menu">
<ul>
<li><a href="index.php">HOME</a></li>
<li><a href="innovation.php">Innovations</a></li>
<li><a href="postinno.php">Post to Innovators</a></li>
<li><a href="bestinnov.php">Best InnoV</a></li>
<li><a href="upload.php">Upload</a></li>
<li class="selected"><a href="news.php">News</a></li>
<li><a href="about.php">AboutUs</a></li>
<div class="current">
<div class="ctoparr"></div>
<div class="cback"></div>
<div class="cbotarr"></div>
</div>
</ul>
</nav>
<div class="video-container" style="margin-left:5%"><iframe id="ytplayer" type="text/html" width="<?php echo $width ?>" height="<?php echo $height ?>"
src="https://www.youtube.com/embed/<?php echo $id ?>?rel=0&showinfo=0&color=white&iv_load_policy=3"
frameborder="0" allowfullscreen></iframe> </div>
</midle>
<footer align="center">
<img src="line.png" width="100%" height="20px"></footer>
</footer>
</div>
</body>
</html>