0

我有一个表格,我试图在每个单元格的第一行显示两个选项卡。我已将左侧选项卡分成三个图像(左、中、右),并显示一些文本。它应该与左边距对齐。右侧选项卡没有文本,应与右边距对齐。在两个选项卡之间是连接两个选项卡底部的一条线 - 右侧选项卡是一个图像,连接器也是一个图像,所以我要显示五个图像。它还应该拉伸以适应文本(它正在做的)和单元格(它不是)。

它应该看起来像这样:

[文本]__[]

左侧选项卡显示正常,但右侧选项卡不是。这是我的代码:

HTML

<div class='category'>
<span><span><span><span>".$results['category']."</span></span></span></span></div>
<div class='righttab'><span><span></span></span></div>

CSS

.category
    {
    display: block;
    }
.category *
    {
    height: 27px;
    }
.category span
    {
    display: block;
    float: left;
    color: rgb(240,208,128);
    }
.category span span
    {
    background: url(tabmiddle.png) top left repeat-x;
    float: left;
    margin: 0 0 0 0px;
    }
.category span span span
    {
    background: url(tabright.png) top right no-repeat;
    float: left;
    display: block;
    padding-right: 19px;
    }
.category span span span span
    {
    background: url(tableft.png) top left no-repeat;
    display: block;
    padding-left: 19px;
    padding-top: 3px;
    }
.righttab
    {
    display:block;
    float: right;
    }
.righttab span
    {
    background: url(topborder.png) top repeat-x;
    display: block;
    }
.righttab span span
    {
    background: url(righttab.png) top right no-repeat;
    display: block;
    float: right;
    margin-left: 75px;
    }
4

0 回答 0