我有一個注冊表，在表的輸入處有圖示。當我調整視窗大小時，它就會移位（擠壓），這非常令人討厭，誰能告訴我應該怎么做才能讓它固定在原來的位置上。
。span class="hljs-selector-id">#username-logo {
position: relative;
float: left;
top: 40px;
left: 15%;
}
#password-logo {
position: relative;
float: left;
top: 40px;
left: 15%;
}
#email-logo {
position: relative;
float: left;
top: 40px;
left: 15%;
}<form id="form-container">
<h1 id="linklist"/span>> 注冊</h1>。
< input type="text" name="username" id="username" placeholder="Username" required="required">>。
< i class="fas fa-user" id="usernam-logo"> </i>>
< input type="password" name="password" id="password" placeholder="Password" required="required">>
<i class="fas fa-lock" id=" password-logo" > </i>>
< input type="email" name="email" id="email" placeholder="Email" required="required">>。
<i class="fas fa-envelope" id="email-logo"> </i>>
< input type="submit"/span> name="submit" id="submit" value="Register">
</form> uj5u.com熱心網友回復：
包住圖示和輸入，從那里你可以更容易地設計它。圖示的位置完全取決于你的設計。
。span class="hljs-selector-class">.register-form {
display: flex;
flex-wrap: wrap;
max-width: 20rem;
}
.input-container {
display: flex;
}
.input-container input {}。
.input-container i {}< h1 id="linklist">Register</h1>
< form id="form-container" class="register-form">/span>
<div class="input-container">/span>
< input type="text" name="username" id="username" placeholder="Username" required="required">>。
< i class="fas fa-user" id="usernam-logo"> </i>>
</div>/span>
<div class="input-container">
< input type="password"/span> name="password" id="password" placeholder="Password" required="required">>
<i class="fas fa-lock" id=" password-logo" > </i>>
</div>/span>
<div class="input-container">
< input type="email" name="email" id="email" placeholder="Email" required="required">>。
<i class="fas fa-envelope" id="email-logo"> </i>>
</div>/span>
<button type="submit" class="button">> 注冊</button>。
</form>uj5u.com熱心網友回復：
把你的容器position: relative和標志position: absolute，并使用left/right/top/bottom重新定位。
這樣，標志的位置將根據容器（這里是input）而不是根據主體，如果使用得當，將不會在調整大小時發生位移
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/321624.html
標籤：