css浮动左边和关闭间隙 - 2个cols

时间:2014-10-13 15:22:05

标签: css xhtml stylesheet

我正在构建一个下拉菜单,它将显示第二级。我在那里大概是98%,但是我无法接受它。在第二级的下拉菜单中,我想以两个col显示结果,空间最小。目前,我有两个col,但左边有大约14px的空间,距离顶部大约8 px的空间。 请帮忙。 非常感谢:

我已经更新了CSS,但仍无法让它关闭第二个菜单。有任何想法

.drop_menu {
    LIST-STYLE-TYPE: none;
    HEIGHT: 38px; 

}

.drop_menu LI {
    float: left;
    background-color:#fff;
    height:40px;
    margin-top:-6px;
}

.drop_menu LI A {
    float: left;
    color: #000;
    padding: 10px 10px 10px 10px;
    text-decoration: none;
    line-height: 1.389;
    font-size: 17px;
    text-transform: uppercase;
}
 .drop_menu LI A:hover {
    COLOR: #fff; 
    BACKGROUND-COLOR: #b52723;

}
.drop_menu UL {
    LIST-STYLE-TYPE: none; 
    POSITION: absolute; 
    LEFT: -999px; 
    Z-INDEX: 1000;
    TOP: -999px;
    margin-top:19px;
    margin-left:14px;
}
.drop_menu LI:hover {
    BACKGROUND: #fff;
    POSITION: relative;
}

.drop_menu LI:hover UL {
    BACKGROUND: #fff; 
    BORDER-TOP: #b52723 4px solid;
    BORDER-RIGHT: #ccc 1px solid;
    BORDER-BOTTOM: #ccc 1px solid; 
    BORDER-LEFT: #ccc 1px solid; 
    TOP: 30px; 
    WIDTH: 320px;
    LEFT: 0px; 
    padding:0;

}
.drop_menu LI:hover UL LI {

    MARGIN: 0px; 
    DISPLAY: block;

}
.drop_menu LI:hover UL LI A {
    width:140px;
    FONT-SIZE: 12px;
    padding:0;
    text-align: left;
    float:left;

    border:1px solid #333;

}
.drop_menu LI:hover UL LI A:hover {
    BACKGROUND: #fff; 
    COLOR: #b52723;

}

感谢回复人员。根据要求提供小提琴

http://jsfiddle.net/dalew36/06pp180k/

0 个答案:

没有答案