1

何時間も診断を試みた後、これを理解できないようです。

ログインコンテンツを保持する丸いボックスがあります。仕上げのピースを追加した後、コンテンツから飛び出しているようです

ここにそれのjsfiddleがあります、私は本当に混乱しています

http://jsfiddle.net/Ck6Bp/

<p id="loginContainer">
<form>
<input type="text" name="username" value="username" />
<br/>
<input type="password" name="password" value="NSxPussinskiboots" />
<br/>   <span id="mini"><a href="#">Register</a> | <a href="#">Forgot your password?</a></span> 
<br/>
<input type="submit" name="login" value="Log Me In" />Login below:
<br/>
<br/>
</form>

p#loginContainer {
display:block;
font-size:1.5em;
background: rgba(0, 0, 0, .55);
padding:40px;
border-radius:6px;} 
form { width: auto; height:auto; }
4

1 に答える 1

1

<p>タグをタグに変更し<div>ます。ID が適切に呼び出されるように、CSS ファイルのp前のも削除しました。#loginContainer

HTML

<div id="loginContainer">
    <form>
    <input type="text" name="username" value="username" />
    <br/>
    <input type="password" name="password" value="NSxPussinskiboots" />
    <br/>   <span id="mini"><a href="#">Register</a> | <a href="#">Forgot your password?      </a></span> 
    <br/>
    <input type="submit" name="login" value="Log Me In" />Login below:
    <br/>
    <br/>
    </form>
</div>

CSS

#loginContainer {
    display:block;
    //margin-left:60%;
    font-size:1.5em;
    background: rgba(0, 0, 0, .55);
    padding:40px;
    border-radius:6px;
    text-align: left;
}
form { width: auto; height:auto; }

これがフィドルhttp://jsfiddle.net/SfMZH/です。

お役に立てれば!

于 2013-09-26T07:06:31.457 に答える