0

ブラウザー ウィンドウのサイズを変更すると、ページのメイン コンテンツ (テキストとフォーム) がページ上で水平方向に移動します。私のロゴは固定位置にとどまります。これを実現する 2 つのクラス間の css の違いを見つけることができません。CSSは次のとおりです。

.main {width:100%; padding:0; margin:0 auto; min-width: 1020px; overflow: hidden;}
.header { background:url(images/slider_bgpng200.png); background-repeat: repeat-x; padding:0; margin:0 auto; width: 100%; }
.headertop{width: 44%; background: #d3e5e8; height: 30px; min-width: 1020px;float: left;  padding-left: 50px; margin: 0 auto;}
.block_header {margin:0 auto; width:1200px; padding:0; border:none; }
.space { float:left; padding:0; margin:0; }
.header_text { width:200px; float:right; font:normal 11px Tahoma, Geneva, sans-serif; color:#9a9a9a; padding:6px 10px 10px 10px; margin:0; text-align:center;}
.slider { background: transparent; margin:0 auto; padding:0; height:420px;} 
.slider .gallery { margin:0 auto; width:980px; height:420px; padding:0;} 
.slider .textholder {padding-top: 110px; float: left; width: 44%; font-family: 'Roboto', sans-serif; font-size: 40px; color: #93a0a2;padding-left: 30px;}
.formbox{float: right; width: 48%; padding-top: 90px; padding-right: 40px;}

そして、ここにhtmlがあります：

<div class="main">
 <div class="header">
   <div class="headertop"> <img src="images/avidestlogo50perresave.png"  border="0" alt="logo" />
     <div class="header_text"><a href="#">Email</a> | <a href="#">Client Login</a> 
     </div>
   </div>
  <div class="block_header">
      <div class="space"><a href="index.html"></a>
      </div>
  </div>
      <div class="slider">
         <div class="gallery">
            <div class="textholder">
            &nbsp;&nbsp;&nbsp;&nbsp;Where Student and <br />
            &nbsp;&nbsp;&nbsp;Alumni Freelancers <br />&nbsp;&nbsp;Get Hired
            </div>
            <div class = "formbox">Form is here
            </div>
         </div>
      </div>
  </div>
 </div>
</div>

このサイトは avidest.com/schneer にアップされているので、私が話している内容を見ることができます。ご協力いただきありがとうございます。

4

1 に答える 1

1

あなたはwidth:100%あなたの.headerクラスにいます。

width:1200pxこれはあなたの.block_headerクラスと同じではありません。

ページ全体を同じように中央揃えにしたい場合は、ヘッダーとコンテンツdivを、単一のクラスで中央揃えを行うアウターでラップすることをお勧めします

于 2013-02-28T21:15:16.847 に答える