如何在输入字段顶部放置加号答案

【问题标题】：How to place a plus symbol over top of a input field如何在输入字段顶部放置加号
【发布时间】：2021-01-06 09:23:11
【问题描述】：

The current output of my pgm(the red nd green circle were edited by me for ur understanding) 红圈内的加号应在绿圈的位置。

你能帮我解决这个问题吗..!! 提前致谢，

我的代码：

 .plussymbol{
     font-size: 40px;
     color: #a4508b;
     background-color:transparent;
     border-radius: 20px;
     border: none;
     display: inline-block;
     cursor: pointer;
     position: absolute;
    /*top: 37%;
     right: 28%;
    */
     padding-top: 15px;
     vertical-align: middle;
}
 .userip{
     width:90%;
     height: 65px;
     border-radius: 30px;
     font-size: 27px;
     font-weight: lighter;
     font-family: 'Hanalei Fill', cursive;
     background-color: #ece7e7;
     color: #000;
     border: none;
     -webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.6);
     box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.6);
     padding-right: 20px;
}

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css" integrity="sha512-+4zCK9k+qNFUR5X+cKL9EIR+ZOhtIloNl9GIKS57V1MyNsYpYcUrUeQc9vNfzsWfV28IaLL3i96P9sdNyeRssA==" crossorigin="anonymous" />
</head>
<body>
    <form>
        <input type="text" class="userip" placeholder="Add Today's Task?" autocomplete="on">
        <button type="button" class="plussymbol">
                 <i class="fas fa-plus-square"></i>
             </button>
    </form>
</body>

</html>

【问题讨论】：

标签： html css button input tags

【解决方案1】：

你可以这样做。

 .plussymbol{
    font-size: 40px;
    color: #a4508b;
    background-color:transparent;
    border-radius: 20px;
    border: none;
    display: inline-block;
    cursor: pointer;
    margin-left: -60px;
   }

【讨论】：

非常感谢它确实有效但是，现在prblm是当我向下滚动时，加号正在向下移动......有没有办法永久修复它
是的，使用属性,"Position:sticky;"帮了我。无论如何谢谢你的帮助..!!