如何让两个滚动条的元素相邻？

我目前正在编程一个视图，它包含两个可以在彼此之间移动信息的列表元素。下面是它目前的样子图片：如何让两个滚动条的元素相邻？

Demo

我理应在页面很大的空间表“CodigoAGrupador”对表“Catalogos”，以适应在右边，它使用要做到这一点，但是当我添加滚动条时，突然间，他们只能在垂直方向上，而不是在水平方向上。

这里的CSS代码：

#products { 
     float: left; 
     width: 500px; 
    } 

    #cart { 
     width: 400px; 
     right: 0px; 
     top: 0px; 
     float: right; 
     max-height: 600px; 
     overflow-y:auto; 
     margin: 2px,2px,2px,2px; 
     overflow-x: auto; 
    } 
    #ListaCodigos{ 
     max-height:600px; 
     width:500px; 
     overflow-y:auto; 
     margin: 2px,2px,2px,2px; 
     overflow-x: auto; 
    }

而这里的，我使用的HTML视图代码（它包含了我使用动态创建的列表的逻辑，这部分应该不是问题）

<div id="content"> 
    <div id="ListaCodigos"> 
     <h2 class="ui-widget-header">CodigoAgrupador</h2> 
     <div id="products"> 
      <div id="catalog"> 
       @foreach (CodigoAgrupadorCuentas_CE c in Model.CodigosAgrupadores) 
       { 
        if (unchecked(double.Parse(c.CodigoAgrupador) == (int)double.Parse(c.CodigoAgrupador))) 
        { 
         <h3><a href="#">@c.CodigoAgrupador - @c.NombreCuenta</a></h3> 
         <div> 
          <div class="subcatalog"> 
           @foreach (CodigoAgrupadorCuentas_CE c2 in Model.CodigosAgrupadores) 
           { 
            if (double.Parse(c2.CodigoAgrupador) > double.Parse(c.CodigoAgrupador) && double.Parse(c2.CodigoAgrupador) < (double.Parse(c.CodigoAgrupador) + 1)) 
            { 
             <h4><a href="#">@c2.CodigoAgrupador - @c2.NombreCuenta</a></h4> 
             <div> 
              <div class="SpecificCatalog"> 
               <ol> 
                <li class="placeholder">Add your items here</li> 
               </ol> 
              </div> 
             </div> 
            } 
           } 
          </div> 
          <div class="GeneralCatalog"> 
           <ol> 
            <li class="placeholder">Add your items here</li> 
           </ol> 
          </div> 
         </div> 
        } 
       } 
      </div> 
     </div> 
    </div> 
    <div id="cart"> 
     <h2 class="ui-widget-header">Catalogos</h2> 
     <div class="ui-widget-content"> 
      @foreach (LedgerChartOfAccounts c in Model.Catalogos) 
      { 
       if (c.CodigoAgrupador == null) 
       { 
        <ul> 
         <li class="draggable">@c.GLAccountNumber - @c.GLAccountName </li> 
        </ul> 
       } 
      } 
     </div> 
    </div> 
    <div> 
     <footer>Inserte los catalogos en el grupo que pertenescan, jale.</footer> 
    </div> 
</div>

这可能是一个很简单的问题，但我无法找到任何具体回答我的问题，我已经奋斗了很长一段时间。欢迎任何帮助。

来源

2014-11-21 Jorge Díaz

你可以只需float:leftmenu和ListaCodigos让它拉起来。确保content足够宽，以便将它们都放在一条线上。

然而，再经过menudiv你将要增加一个<div style="clear:both"></div>

来源

2014-11-21 17:01:32

我无法相信我忘了加浮动：当我已经又增加了浮到一切留给ListaCodigos。我刚才补充说，它是固定的。谢谢。 – 2014-11-21 17:05:27

@JorgeDíaz非常欢迎你！乐意效劳！ :) – 2014-11-21 17:05:54

如何让两个滚动条的元素相邻？

回答

相关问题