两个标签通过javascript更改其宽度时自动改变位置

I have label in anchor tag:

我在锚标签中有标签:

<a href="#" runat="server" id="Anchor" class="class1"><span><asp:label ID="label1"   runat="server" ForeColor="White" Font-Size="Smaller" Text=text1" >

and a label2 to contain a user name. What I want is when label2 adjusts its width according to user name then label1 auto adjusts its position according to label1. Here I have a problem when the username is something like "tttttttttttttttttttttttttttttt" - after this label1 aligns, but when the username is smaller like "ttttt" then a lot of space is shown between the labels.

以及包含用户名的label2。我想要的是当label2根据用户名调整其宽度时,label1会根据label1自动调整其位置。当用户名是“tttttttttttttttttttttttttttttttttttttttttttt”时,我遇到了一个问题 - 在此标签1对齐之后,但当用户名像“ttttt”那样较小时,标签之间会显示很多空格。

 .class1 
    {
    position: absolute;
    z-index: 4;
    top: 65px;
    right: 43.3%;
    /*left: 30.6%;*/
    -webkit-tap-highlight-color: transparent;

     }

     body.reversed .class1 {
        left: 8px;
        right: auto;
    }
    .fixed-title-bar > .class1 {
        position: fixed;
    }
    .class1 > span {
        padding: 0 8px 0 30px;
        background: url(../img/inout5.png) no-repeat 7px center;
        font-size: 16px;
        height: 27px;
        line-height: 27px;
    }

    .class1 > span {
        display: block;
        border: 1px solid #020203;
        color: white;
        -webkit-text-shadow: 0 -1px 0 black;
        -moz-text-shadow: 0 -1px 0 black;
        text-shadow: 0 -1px 0 black;
        background-color: #454545;
        background-color: rgba(255, 255, 255, 0.3);
        -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 rgba(255, 255, 255, 0.25);
        -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 rgba(255, 255, 255, 0.25);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 rgba(255, 255, 255, 0.25);
        -webkit-background-clip: padding-box;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        width:56px;

    }

1 个解决方案

#1

issue reslove by some CSS setting and ul li tags

通过一些CSS设置和ul li标签重新发出问题