JSFiddle - React, Tailwind, and code Playground

by jonwang

HTML

<script src="http://lib.sinaapp.com/js/bootstrap/2.3.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="http://lib.sinaapp.com/js/bootstrap/2.3.1/css/bootstrap.css">
<div id="global-div">
    <div class="pos">
        <ul class="nav nvamenu">
            <li class="active">
                <a href="javascript:" class="dropdown-toggle" data-toggle="dropdown"><span>下拉菜单</span></a>
                <ul class="dropdown-menu">
                    <li><a href="#">Action</a></li>
                    <li><a href="#">Another action</a></li>
                    <li><a href="#">Some link</a></li>
                    <li><a href="#">One more separated link</a></li>
                </ul>
            </li>
        </ul>
    </div>
    
    <div class="pos2">
        <div class="box"><br >test</div>
    </div>
</div>

CSS

#global-div, #main-div {
    position: fixed;
    left:0;
    right:0;
    overflow: hidden;
}
#global-div a span{
    color:#fff;
    background:red;
}

#global-div .pos {
    position: absolute;
    width:300px;
}

#global-div .pos2 {
    position: absolute;
    width:300px;
    top:10px;
}

.box{
    background:green;
    height:200px;
}