我试图将下面的“登录”按钮放在登录表单的右端,但由于某种原因我无法实现它。
我想要它的外观:
目前的样子:
我的前端代码如下:
<RuxContainer className="container">
<div slot="header" className="header-container">
<h3 className="first-header-item">LOGO</h3>
<RuxClock timezone="Z"></RuxClock>
<RuxMonitoringIcon status="normal"></RuxMonitoringIcon>
</div>
<div className="body-container">
<form className="rux-form">
<h2 className="body-sign-in">SIGN IN</h2>
<h6>Measure your success in the Space Force!</h6>
<div className="sign-in-inputs">
<rux-input
id="email"
placeholder="Email@astro.com"
label="Email"
type="email"
ruxblur="{handleValidation()}"
></rux-input>
<rux-input id="pw" label="Password" type="password"></rux-input>
</div>
<div className="sign-in-helper-functions">
<rux-checkbox class="checkbox">Remember me</rux-checkbox>
<h2 className="forgot-password">Forgot Password?</h2>
</div>
</form>
<rux-button className="sign-in-btn" type="submit">
Sign in
</rux-button>
</div>
</RuxContainer>
Run Code Online (Sandbox Code Playgroud)
我的 CSS 是什么样子的:
.header-container {
display: flex;
justify-content: space-between;
align-items: center;
}
.body-container {
display: flex;
flex-direction: column; …Run Code Online (Sandbox Code Playgroud)