编辑并列DIV-CSDN博客

html编辑控件，编写3个div并行,先看一下效果,如下图：

我需要将整个白色部分作为一个整体，编辑控件使用，其实使用到的就是div中的float:left属性，并且定义好宽度。css 部分代码如下：

.divtitle-item1{width:58%; float:left; }
.divtitle-item2{width:21%;float:left;}
.divtitle-item3{width:21%;float:left;}

但是多个当多个白色控件使用的时候，又出现上浮的情况，开始的时候，我是使用ul中的li来控制工具列表，但是发现还是不行，在位一行，所以我就直接使用源html代码，然后编辑相距距离Margin，问题解决；

整个是控件最外部div样式：

.divtitle{width:100%;float:left;font-size:1.0rem; font-weight:bold; margin:10px 0px 0px 0px; display:inline;}

整个白色控件的html代码如下：

 <div class="divorder">
                         <hr  style="margin:0px; padding:0px;"/>
                         <div class="divbalance-div1">
                                <div class="divorder-div2">
                                    <p class="divorder-p1">西餐厅现金优惠券</p>
                                    <p>有效期至2013.08.08</p>
                                </div>
                                <div class="divtitle-item2">
                                    <p class="divorder-p2">-600</p>
                                </div>
                                <div class="divtitle-item2">
                                  <p class="divorder-p1">未使用</p>
                                </div>
                            </div>
                            <hr  style="margin:0px; padding:0px;"/>
                       </div>