在div中对齐div内容

Question

我有一个2列div左栏是导航栏，右栏是页面内容

Chrome中的

都正确显示，但是第二列的内容显示为第二列，但其显示与导航栏底部对齐，导航条的高度为内容列中的空白区域

请告知我如何解决这个问题

#wrapper {
  margin-left: 250px;
  position: relative;
  margin-top: 0;
  top: 0;
}

#content {
  float: right;
  width: 100%;
  margin-left: 5px;
  background-color: white;
}

#sidebar {
  float: left;
  width: 250px;
  margin-left: -250px;
  background-color: #FFA;
}

#cleared {
  clear: both;
}

body {
  font: 11px 'Trebuchet MS';
  color: #404040;
}

fieldset,
legend {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  top: 0;
}

<div id="wrapper">

  <div id="sidebar">
    <cfinclude template="navbar.cfm">
  </div>

  <div id="content">
    <fieldset>
      <cfinclude template="b2b_add_device.cfm">
        <cfabort>
    </fieldset>

  </div>
</div>

Answer 1

您可以查看以下代码段：

＆＃13;

＆＃13;

#wrapper {
  position:relative; 
  margin-top:0; 
  top:0;
}
#content {
  margin-left:250px;
  background-color: white;
}
#sidebar {
  float: left;
  width: 250px;
  background-color: #FFA;
}
#cleared {
  clear: both;
}

body {
    font: 11px 'Trebuchet MS';
    color: #404040;
}

fieldset, legend {
    margin:0;
    padding:0;
    width:100%;
    height:100%; top:0;
}

＆＃13;

<div id="wrapper">

<div id="sidebar"><cfinclude template="navbar.cfm"></div>

<div id="content">
<fieldset>
    <cfinclude template="b2b_add_device.cfm"> 
    <cfabort>
</fieldset>

＆＃13;

＆＃13;

＆＃13;