Div对齐中的问题

Question

我有三个div。其中两个我已经对齐为表行的两个单元格，第三个我想向下显示。但第三个div是在第二个div结束后显示的，这是我不想要的。我想要第三个div，即id为menu的div在按钮frontdesk之后显示。这是使用的css。。

#wrapper {
display:table;
position:relative;
height:auto;
width: 100%;
}
#row {
display:table-row;
}
#first {
display:table-cell;
width:75%;
}
#second {
display:table-cell;
width:25%;
height:600px;
}
.menucss {
position:relative;
display:table-row;
width: 168px;
height:auto;
}

这是小提琴环节。。Fiddle。请帮我纠正这个。。谢谢

Answer 1

用.menucss类尝试position:absolute，即：

.menucss
{
 position:absolute;
 top:20px;
 width: 168px;
 height:auto;    
}

这是小提琴链接

Answer 2

试试这个-

#wrapper {
display:table;
position:relative;
height:auto;
width:  100%;
}
#row {
    display:table-row;
}
#first {
    display:table-cell;
    width:75%;
}
#second {
    display:table-cell;
    width:25%;
    height:600px;
}
.menucss
{
 position:absolute;
 top:25px;
 height:auto;    
}

<div id="wrapper">
    <div id="row">
        <div id="first">
            <button id="Front Desk" style="margin-left:15px;vertical-align:top; font-size:20px;">Front Desk</button>
            <button id="Report" style="margin-left:15px; vertical-align:top; font-size:20px;">Report</button>
        </div>
        <div id="second" style="border:1px solid;">This is the Sample Computation Div...</div>
    </div>
    <div id="menu" class="menucss">
        <br />
        <label id="menulist" style="font-style:normal;margin-left:25px; font-size:15px;font-weight:bold; float:left; padding-left:0px;">Menu List</label>
      
    </div>
</div>