Tabs 如何将选项卡定位到选项卡栏的右侧?

Tabs 如何将选项卡定位到选项卡栏的右侧?,tabs,position,css-position,Tabs,Position,Css Position,我需要像往常一样在条的左侧有一些选项卡,在条的右端有两个选项卡 我的JSFIDLE文件是 选项卡栏必须位于屏幕底部的某个点上。因此,我必须将其定位为绝对。因此,我无法将标记相对地定位到条上 我试过float:right,但也没用 有什么建议吗?这会让你走上正确的方向吗: .tab-box { margin: 0; position: absolute; /*I need to fix these tabs at some point at the bottom part of

我需要像往常一样在条的左侧有一些选项卡,在条的右端有两个选项卡

我的JSFIDLE文件是

选项卡栏必须位于屏幕底部的某个点上。因此,我必须将其定位为绝对。因此,我无法将标记相对地定位到条上

我试过float:right,但也没用


有什么建议吗?

这会让你走上正确的方向吗:

.tab-box {
    margin: 0;
    position: absolute;  /*I need to fix these tabs at some point at the bottom part of the screen*/
    bottom: 248px;
    left: 0;    
}
#complexTab {
    width:100%;
}
.tab-box a {
    font-family:Helvetica, Arial, sans-serif;
    border: 1px solid #3A3D42;
    color: #666666;
    padding: 5px 5px;
    background-color: #eee;        
     float:right;       
    -webkit-border-top-left-radius: 4px;
    -moz-border-top-left-radius: 4px;    
    -webkit-border-top-right-radius: 4px;
    -moz-border-top-right-radius: 4px;
    margin: -2px;   /*remove space btw tabs*/
}

.tab-box a:first-child {
    -webkit-border-top-left-radius: 0;
    -moz-border-top-left-radius: 0;
}

.tabcontent {
    height:248px;
    margin:0;
    padding:0;
    overflow:hidden;
    border-top:1px solid #3A3D42;

    background-color:#757D8A;

    box-shadow:0 1px 0 rgba(255,255,255,.3) inset;
    -moz-box-shadow:0 1px 0 rgba(255,255,255,.3) inset;
    -webkit-box-shadow:0 1px 0 rgba(255,255,255,.3) inset;

    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}

.hiden {
    display : none; 
}

我想我忘了设置宽度:100%。但是,有一个小问题。当我让两个标签向右浮动时,左边的标签会稍微向上移动。这使得这些标签和内容之间的差距很小。你知道怎么修吗?谢谢,我不知道你为什么这么做。如果您想要两个单独的选项卡菜单,您可能应该将它们放在单独的容器中。