[英]Not able to see entire text when embeded clear button in inputbox
In Angular, I have added clear button inside input box but after adding it I am not able to see entire text in input box as it is being overlapped.在 Angular 中,我在输入框中添加了清除按钮,但添加后我无法在输入框中看到整个文本,因为它被重叠了。 Please find detailed information below.请在下面找到详细信息。
HTML Code HTML 代码
<ng-template pTemplate="input">
<input pInputText type="text" class="col-input-grid-100" >
<span class="mar-left">
<button (click)="clearmail1(ri)" style="border:none; outline: none; position: relative; width:0;background-color: #fff;">
<i class="pi pi-times"></i>
</button>
</span>
</ng-template>
CSS content CSS内容
.col-input-grid-100{
width: 135%;
margin-left: -10px;
}
.mar-left{
margin-left:-29px;
}
Current Output: Text in input box is test3@test.com.当前Output:输入框文本为test3@test.com。
As you can see in above image "com" is not visible clearly.正如您在上图中看到的那样, “com”并不清晰可见。 I tried multiple ways but things didnt work.我尝试了多种方法,但没有用。 Kindly help me to resolve this issue.请帮我解决这个问题。
Note:笔记:
1. I want to show cross button inside input box only 1.我只想在输入框内显示十字按钮
2. I am not using bootstrap library. 2. 我没有使用引导程序库。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.