FB LOGIN PAGE CSS

-
*{
    margin: 0;
}

body{
    height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.tbox{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    margin: 20px;
}
.bbox{
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex-wrap: nowrap;
    flex-shrink: 5;
    flex-grow: 0;
    height: 250px;
    width: 300px;
    /* border: 2px solid salmon; */
    padding: 10px;
    box-sizing: content-box;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.tbox .fb{
    font-size: 50px;
    color: rgb(16, 53, 121);
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}

.bbox input{
    border: 0cap;
    margin-bottom: 5px;
    padding: 10px;
    padding-left: 20px;
    padding-right: 20px;
    font-size:small;
   
}
.bbox .Login{
    border: 0cap;
    width: 100%;
    padding: 10px;
    background-color: blue;
    color: white;
}
.bbox .link{
    margin-bottom: 5px;
    margin-top: 5px;
    text-decoration: none;
    text-align: center;
    font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif ;
}

.bbox .Create-New-Account{
    position: relative;
    margin-top: auto;
    width: 50%;
    padding: 8px;
    margin-bottom: 10px;
    align-self: center;
    background-color: green;
    color: white;
    border: 0cap;
}

Comments

Post a Comment

Popular posts from this blog

HTML FORMS

-
  <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < title > Document </ title > </ head > < body >     < H1 > Forms in HTML </ H1 >     < form action = "/submit.php" > < div >   < label for = "Name" > Name </ label >   < input type = "text" placeholder = "Enter name" > </ div > < div >     < label for = "Phone" > Phone </ label >     < input type = "tel" placeholder = "Enter phone no." >     </ div >     < div >     < label for = "Email" > Email </ label >     < input type = "email" placeholder = "Email" >     </ div >     < div >     < l...
Read more

FORM STYLING IN CSS

-
<! DOCTYPE html > < html lang = "en" >   < head >     < meta charset = "UTF-8" />     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" />     < title > forms </ title >   </ head >   < style >     body {       margin : 0 ;       padding : 0 ;     }     .csf {       display : flexbox;       text-align : center ;       background-color : rgb ( 216 , 216 , 216 );       height : 400px ;       width : 550px ;       padding : 90px 0px 0px 15px ;       margin-left : 40% ;       margin-top : 10% ;       border-radius : 2px ;       border : 2px solid ;       font-size : 19px ;     }     input {       mar...
Read more