输入文本字段的长度与大小不一致

时间:2014-03-31 05:11:19

标签: html css input

我有一个输入文本框,我试图让它成为值字段中覆盖的文本量的确切长度。我加倍检查,其大小与值字段中的字符数相同。但是,输入框看起来比文本短。括号只是Laravel Blade语法中的php echos。代码如下:

HTML:

<div class="fan-name-change">
<input type="text" size="{{$name_length}}" class="fan-name" autocomplete="off" value="{{$fan->first_name}} {{$fan->last_name}}" id="user_name" name="user_name" placeholder="Name">
</div>

CSS:

.fan-name-change {
    margin: 31px 0 0;
    display:block;

}

.fan-name-change input[type="text"] {

    height: 40px;
    padding: 5px;
    background: rgba(50, 50, 54, 0.5);
    border-radius: 0px;
    border: 0px;
    color: #FFFFFF;
    font-size: 15px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    font-size: 32px;
    line-height: 27px;
    margin:0 auto;

}

1 个答案:

答案 0 :(得分:0)

您需要使用CSS。所以

style="width:{{$name_length*$fontSize}}px;"
编辑:对不起,错过了一些!