CSS Float right does not working

Question

私はWebデザインを初めて使い、asp.netページに問題があり、CSSを使用しています。私の問題は、私のウェブサイトの構造をこのようにしたいということです。

ヘッダー-----------------

NavBar |コンテンツ

............ | ......

フッター-----------------

しかし、私はそれが浮動小数点にもかかわらずコンテンツの長いページを持っているときに一般的な設計をしています：右divそれは私のナビゲーションバーよりも長い場合は、その下に表示されます。だから私は何かを得る

ヘッダー-----------------

NavBar |コンテンツ

........... |コンテンツ

|コンテンツ

| ...

フッター------------ -----

これは私がいくつかの重要なタグ/コンセプトを見逃していますか？以下はCSSとページのコードです。

<form id="masterForm" runat="server" > 

<div id="container" > 
     <div id="header"><br />   
     <h1>Simon & Cats Travel Blog</h1> 
     </div> 

     <div id="sidebar">    
     <asp:SiteMapDataSource ID="web" runat="server" />  
     <asp:TreeView ID="siteTreeView" runat="server" DataSourceID="web" ImageSet="Arrows" > 
     </asp:TreeView> 


     <div >    
      <asp:LoginView ID="loginView" runat="server">    
      <AnonymousTemplate> 
      </AnonymousTemplate> 
      <LoggedInTemplate > 
      </asp:LoginView> 

     </div> 
     </div> 

     <div id="content" runat="server" > 
     <br /> 
     <asp:SiteMapPath ID="siteBreadcrumb" runat="server"> 
     </asp:SiteMapPath> 
     <br />  
      <asp:ContentPlaceHolder ID="HeaderSectionContent" runat="server" > 
      </asp:ContentPlaceHolder>    
     </div> 

     <div id="footer" >      
     </div> 
</div> 

</form> 


    body { 
background-color: #4a2A00; 
font-family: verdana,arial,serif; 
font-size: 0.9em; 
margin-bottom: 20px; 
margin-top: 20px; 
text-align: center; 
    } 
container { 
    width:85%; 
    color: #000000; 
    text-align: left; 
    top: 0px; 
    left: 0px; 
    background-color: #F5BF7A ; 
     } 

header{ 
    margin-bottom: 10px; 
    background: url(banner.jpg) no-repeat; 
    height: 140px; 
    width: 100%; 
     } 

sidebar{ 
    float: left; 
    width: 25%; 
    margin-left: 1%; 
    display: inline; 
     } 

content{ 
    float: right; 
    width: 68%; 
    margin-left: 3%; 
    background-color : White ; 
     } 

footer{ 
    clear: both; 
    color: #000000; 
    background-color : White ; 
    text-align: right; 
    font-size: 0.7em; 
     } 

Answer 1

よく似たような問題が発生しています。私はあなたがこの記事を読むことをお勧めします。

http://www.winstonprakash.com/articles/netbeans/FixedPageLayout.html。

（