yahoo登陆css布局有关问题 _HTML/CSS

yahoo登陆css布局问题
http://cn.yahoo.com/
yahoo右边这一小块邮箱，彩票，旅行，日报订阅的div+css布局是怎么弄得，谁能给我一个大体的思路就行，嘿嘿，有代码是最好的。。。

------解决方案--------------------

HTML code


<!doctype html>
<html>
    <head>
        <meta charset="gb2312" />
        <title></title>
        <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.9.0/build/reset/reset-min.css" />
        <style>
            body { font-size:14px; }
            
            .tab-wrap {
                position:relative;
                margin:100px 0 0 200px;
                padding-top:5px;
                width:353px; height:196px;
                border:1px solid #c6d8e0;
                background:#eef4f9;
            }
            .tab-wrap dt {
                float:left; _display:inline;
                margin-left:5px;
                width:80px; line-height:34px;
                border:1px solid #c6d8e0;
                background:#fff;
                text-align:center;
            }
            .tab-wrap dt.current {
                position:relative; z-index:999;
                height:43px;
                border-bottom:none;
                font-weight:bold;
            }
            .tab-wrap dd {
                display:none;
                position:absolute; left:5px; top:48px;
                padding:10px;
                width:321px; height:126px;
                border:1px solid #c6d8e0;
                background:#fff;
            }
            .tab-wrap dd.current {
                display:block;
            }
        </style>
    </head>
    <body>    
        <dl class="tab-wrap">
            <dt class="current">栏目1</dt>
            <dd class="current">
                <ul>
                    <li>a</li>
                    <li>b</li>
                    <li>c</li>
                </ul>
            </dd>
            <dt>栏目2</dt>
            <dd>
                <ul>
                    <li>1</li>
                    <li>2</li>
                    <li>3</li>
                </ul>
            </dd>
            <dt>栏目3</dt>
            <dd>
                <ul>
                    <li>a</li>
                    <li>b</li>
                    <li>c</li>
                </ul>
            </dd>
            <dt>栏目4</dt>
            <dd>
                <ul>
                    <li>1</li>
                    <li>2</li>
                    <li>3</li>
                </ul>
            </dd>            
        </dl>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
        <script>
            jQuery(function($){
                $('dl.tab-wrap dt').mouseover(function(){
                    $(this).addClass('current').siblings().removeClass('current');
                    $('dl.tab-wrap dd:eq('+$('dl.tab-wrap dt').index(this)+')').addClass('current')
                })
            })
        </script>
    </body>
</html>