input:-webkit-autofill 관련 질문에요~

동동가이 2년 전 조회 1,255

검색창 입력시 자동완성시 배경색을 변경하려고

.xans-layout-searchheader input:-webkit-autofill { -webkit-box-shadow: 0 0 0 100px #17197e inset ; -webkit-text-fill-color: #fff; border-radius:50px; }

적용시켰는데

라인이 생기네요. border-radius를 넣으니 바깥라인이 생기고 border-radius를 삭제하니 안나오네요

box-shadow 경우 바깥쪽으로 그림자효과가 안나오도록 하는 방법이 있을까요??

#inputautofill

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

정렬:

배르만

2년 전

라인은 왜 생기는지 모르겠습니다.

다른 UI 랑 겹친것이 아닌가 생각해 봅니다.

단순히 이렇게만 해봤을때 정상표현 되는것 같습니다.

</p>

<p><style>

.xans-layout-searchheader input {

    padding: 1em;

    background-color: #eee;

    border: 0;

    border-radius:50px;

    outline: none;

    -webkit-appearance: none;

}

.xans-layout-searchheader input:-webkit-autofill {

    -webkit-box-shadow: 0 0 0 100px #17197e inset;

    -webkit-text-fill-color: #fff;

}

</style></p>

<p><div class="xans-layout-searchheader">

    <input type="text" name="q" />

</div></p>

<p>

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인

input:-webkit-autofill 관련 질문에요~

답변 1개

공유하기