0

私の問題は、ウィンドウのサイズを変更するときです（小さい）、divの1つがナビゲーションバーの上を通過するだけです...これは面倒ですが、簡単に修正できる方法があると思います。コードを提供できますが、エディター プログラムでテストする必要があります。その後、サイズを変更すると、私の意味がわかります。

HTML コードはこちら:

<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="WorkFieldStartpage.css"/>


 </head>
  <body>
    <div id="upperblock">


     </div>

  <div class="topbar"></div>  



  <div id="pageContainer">

   <div id="pageContainer2">


            <div>
                <div id="leftnavigation">
                    <ul>
                    <li> <h4> Navigation </h4> </li>    
                    <li>Test text</li>
                    <li>Test text</li>
                    <li>Test text</li>

                    </ul>


                    </div>
                <div id="mainContainer">

                    <div id="newsfeed"></div>



                </div>

            </div>
       </div>
      </div>     

      </body>
      </html>

CSS コードはこちら:

 body {
 color: #333;
 line-height: 1.28;
 text-align: left;
 direction: ltr;

 }

 div {
 display: block;   



 }



 .topbar {
 font-family: sans-serif;
 font-size:12px;
 font-weight: bold;
 background-color: #11BD83;
 height: px;
 width: 100%;
 position:fixed;
 left: 0px;
 top: 0px;

 }


 #pageContainer {
 margin: 0 auto;
 position: relative;
  zoom: 1;
  min-height: 600px;
   }

  #pageContainer2 {
  margin: 0;
  outline: none;
  padding: 0;
  width: auto;



  }

  ul {
  list-style-type: none;
  }

  h4 {
  text-decoration:underline;



  }





 #mainContainer {
 display: block;
 width: 620px;    
 border-right: 1px solid #ccc;
 border-left: 1px solid #ccc;
 min-height: 800px;
 margin-left: auto ;
 margin-right: auto ;
 margin-top: 58px;   
 }

 #leftnavigation {
 float: left;
 height: 300px;
 width: 120.5px;
 text-align: left;
 font-family: sans-serif;
 font-size: 15px;
 padding-right: 30px;
 display:block;




 }
4

2 に答える 2