title: How to split background color into two using css
body: <p>I'm new to css I need to split an HTML page into two background and top of that i need to have text and login form also.can i have sample css and html code</p>
  
  <p>i have tried in css like this</p>
  
  <pre><code>.logindiv {
    height: 200px;
    width: 200px;
    background: linear-gradient(to bottom, #1F4E79 50%, #FFFF 50%);
  }  
  </code></pre>
  
  <p>HTML </p>
  
  <pre><code>&lt;div class="container logindiv"&gt;
      &lt;div class="row"&gt;
          &lt;div class="col-md-4 col-md-offset-4"&gt;
              &lt;div class="login-panel panel panel-default"&gt;
                  &lt;div class="panel-heading"&gt;
                      &lt;h3 class="panel-title"&gt;Please Sign In&lt;/h3&gt;
                  &lt;/div&gt;
                  &lt;div class="panel-body"&gt;
                      @using (Html.BeginForm("Login", "Account", FormMethod.Post, new { @class = "form-signin" }))
                      {
                          @Html.AntiForgeryToken()
                          @Html.ValidationSummary(true)
  
                          &lt;fieldset&gt;
                              &lt;div class="form-group"&gt;
                                  &lt;input class="form-control" placeholder="Username" name="Username" type="text" autofocus&gt;
                              &lt;/div&gt;
                              &lt;div class="form-group"&gt;
                                  &lt;input class="form-control" placeholder="Password" name="password" type="password" value=""&gt;
                              &lt;/div&gt;
                              &lt;div class="checkbox"&gt;
                                  &lt;label&gt;
                                      &lt;input name="remember" type="checkbox" value="Remember Me"&gt;Remember Me
                                  &lt;/label&gt;
                              &lt;/div&gt;
                              &lt;!-- Change this to a button or input when using this as a form &lt;a href="#" class="btn btn-lg btn-success btn-block"&gt;Login&lt;/a&gt; --&gt;
  
                              &lt;button class="btn btn-lg btn-primary btn-block" name="logsubmit" id="logsubmit" type="submit"&gt;Login&lt;/button&gt;
  
                          &lt;/fieldset&gt;
                      }
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>