0

この質問はすでに他の人から尋ねられています。そこで提案を試みましたが、うまくいきませんでした。リンク

ここに私の問題があります.Bootstrap 3を使用して簡単なログインページを作成しました.IE8を除くすべてのブラウザで正常に動作します. もう 1 つの問題は、すべてのブラウザでページの下部にスクロール バーが表示されることです。スクロールバーの問題のスクリーンショットhttp://i42.tinypic.com/sqgh82.png

HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Bootstrap 3</title>

<link href="css/bootstrap.css" rel="stylesheet" media="screen">
<link href="css/bootstrap-theme.css" rel="stylesheet" media="screen">
<link href="css/style.css" rel="stylesheet" type="text/css">

<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="js/html5shiv.js"></script>
<script src="js/respond.min.js"></script>
<![endif]-->

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery-1.9.1.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.js"></script>

<style>
body{
    background-color:#f2f2f2;
}
</style>

</head>

<body>


<div class="row">

<div id="login_panel_alerts" class="col-lg-4 center">
    <div class="alert alert-danger">Something went wrong!<button type="button" class="close" data-dismiss="alert">&times;</button></div>
    <div class="alert alert-success">Success!</div>
</div>

    <div id="login_panel" class="col-lg-3 center modal-content">

    <form>
    <fieldset>
        <legend>Login</legend>

        <div class="form-group">
        <label>Username</label>
        <input type="text" class="form-control form-inline" placeholder="Enter username">
        </div>

        <div class="form-group">
        <label>Password</label>
        <input type="password" class="form-control" placeholder="Enter password">
        </div>

        <div class="form-group">
        <button type="button" class="btn btn-primary">Login</button>
        <button type="button" class="btn btn-default">Reset</button>
        <button type="button" class="btn btn-link">Forgot password?</button>
        </div>


    </fieldset>
    </form>

    </div><!--login_panel-->

</div>


</body>
</html>
4

3 に答える 3

0 
<style>
body
{
    background-color:#f2f2f2;
    overflow-x:  hidden;
}
.center
{
    float: none; 
    margin-left: auto;
    margin-right: auto;
}
</style>

これを試して。

于 2013-08-21T05:25:26.770 に答える