根据其他DIV标签自动更改DIV的高度

时间:2017-01-18 09:40:12

标签: css css3

这是我的网页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>

0 个答案:

没有答案