Scribd Logo
Upload

Welcome to Scribd!

  • Estilo

    Uploaded by

    EL BARON
    5 views2 pages
    This CSS document defines styles for a login form with two columns of equal width - a blue left column and a white right column containing the form. It styles form controls such as text inputs and buttons to be block elements taking the full width, and adds padding, borders, and colors. It also includes styles for focus states and hover interactions.

    Original Description:

    Original Title

    Estilo.txt

    Copyright

    © © All Rights Reserved

    Available Formats

    TXT, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    This CSS document defines styles for a login form with two columns of equal width - a blue left column and a white right column containing the form. It styles form controls such as text inputs and buttons to be block elements taking the full width, and adds padding, borders, and colors. It also includes styles for focus states and hover interactions.

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    5 views2 pages

    Estilo

    Uploaded by

    EL BARON
    This CSS document defines styles for a login form with two columns of equal width - a blue left column and a white right column containing the form. It styles form controls such as text inputs and buttons to be block elements taking the full width, and adds padding, borders, and colors. It also includes styles for focus states and hover interactions.

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 2

    body {

    margin: 0;
    padding: 0;
    background-color: #FFFFFF; /* blanco */
    font-family: Arial, sans-serif;
    }
    .container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    height: 100vh;
    }
    .left {
    width: 50%;
    background-color: #0072C6; /* azul */
    color: #FFFFFF;
    padding: 50px;
    box-sizing: border-box;
    }
    .right {
    width: 50%;
    background-color: #FFFFFF; /* blanco */
    color: #333333;
    padding: 50px;
    box-sizing: border-box;
    }
    .form-control {
    display: block;
    width: 100%;
    padding: 10px;
    margin-bottom: 20px;
    border: none;
    border-radius: 5px;
    background-color: #F0F0F0;
    font-size: 16px;
    box-sizing: border-box;
    }
    .form-control:focus {
    outline: none;
    background-color: #FFFFFF;
    box-shadow: 0 0 5px #0072C6;
    }
    .form-control::placeholder {
    color: #999999;
    }
    .btn {
    display: inline-block;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    background-color: #0072C6; /* azul */
    color: #FFFFFF;
    font-size: 16px;
    cursor: pointer;
    }
    .btn:hover {
    background-color: #005AA6;
    }
    .btn:active {
    background-color: #004A8E;
    }

    You might also like