HTML/CSS：布局问题

基本上，我正在尝试创建一个简单的网页模板，其中将包含3行。第一个是包含两列的页眉，第二个只是主体，最后一个是页脚

在编码方面，我正在做这种布局

<div id="wrapper">
    <div id="header">
        <header>
        </header>
        <div id="col2>
        </div>
    </div>
    <div="mainbody"></div>
    <footer></footer>

有两列的标题

<div id="header">
<div id="column1" style="float:left;">Image</div>
<div id="column2" style="float:left;">Buttons</div>
</div>


形象
按钮

现在将所需的左边距添加到第二列div中。它将在两列之间创建空间

<div id="header">
<div id="column1" style="float:left;">Image</div>
<div id="column2" style="float:left;">Buttons</div>
</div>

<div id="wrapper">
     <header>
       <div id="column1" style="float:left;">Image</div>
       <div id="column2" style="float:left;">Buttons</div>
      </header>

   <div class="mainbody">
     Content
   </div>

<footer></footer>

形象
按钮
内容

使用这个
它是一个简单的结构，可以创建如下（）

HTML是

<div id="wrapper">
    <div id="header">
        <header><img src='http://www.topnews.in/files/facebook-yahoo.jpeg' height=200 />
        </header>
        <div id="col2"><input type=Button value ="button 1" /><br><input type=Button value ="button 1" /><br><input type=Button value ="button 1" /><br>
        </div>
    </div>
    <div="mainbody">mainbody
    </div>
    <footer></footer>
</div>

希望它能帮助您：）
也发布css代码，或者创建dabblet开始工作可能是mystypo中的问题
你可以发布你想要的结果的图片和css你是如何尝试的…….谢谢你的回复，就像我试图通过float:left/rights做的那样。你的演示向我展示了它在其他地方一定出了问题，结果是因为我使用的是显示框：它不工作。所以，一个简单的改变显示：块使它工作。