Login and Search Bar[Source code]

  • Hello Guest! Welcome to ConsoleCrunch, to help support our site check out the premium upgrades HERE! to get exclusive access to our hidden content.
  • Unable to load portions of the website...
    If you use an ad blocker addon, you should disable it because it interferes with several elements of the site and blocks more than just adverts.
  • Read Rules Before Posting Post Virus Scans with every program.

Psycho_Coder

Active Poster
Retired Staff
Active Member
Apr 12, 2014
642
481
133
UK
I created this today and someone could finish it off.

44XPJwa.png


Credits:

Me for coding all of it.
Yoshi, For the person icon.

HTML doc.

Code:
        <!DOCTYPE html>
        <title>Hello</title>
        <link rel="stylesheet" type="text/css" href="./css/style.css">
        <head>
        </head>
        <body>
        <div id="headerMenu">
        <form action="search.php?" method="GET">
          <input type="text" name="search" placeholder="Search Now" />
          </form>
          <div id="line">
          </div>
          <button>Register</button>
        </div>

        <div id="Login">
        <img src="images/Login.jpg">
        <input type="text" name="Username" Placeholder="Username"><br>
        <input type="password" name="Password" Placeholder="Password"><br>
        <input type="submit" name="submit" value="Log in">
        </div>
       

        </body>
        </html>

CSS doc
Code:
body {
    margin: 0;
    padding: 0;
    background-color: #f2f2f2;
    font-family: arial, helvetica, sans-serif;
}
#headerMenu {
    background-color: white;
    box-shadow: 0 1px 4px #ccc;
    height: 50px;
    width: 100%;
}
#headerMenu input[type="text"] {
    background-color: #f2f2f2;
    margin-top: 10px;
    margin-left: 350px;
    border-radius: 4px;
    border: 1px solid #ccc;
    height: 25px;
    4px;
    text-indent: 10px;
    width: 500px;
    outline: 0;

}
#headerMenu input[type="text"]:hover {
    background-color: white;
}
#line {
    background-color: #ccc;
    height: 25px;
    width: 1px;
    margin-left: 880px;
    margin-top: -26px;
}
#headerMenu button {
height: 30px;
background-color: #81BEF7;
margin-left: 900px;
margin-top: -27px;
color: white;
position: absolute;
border: 1px solid #ccc;
border-radius: 4px;
width:100px;
outline: 0;

}
#headerMenu button:hover {
    background-color: #58ACFA;
}
#Login {

    background-color: white;
    height: 400px;px;
    margin-top: 20px;
    border-radius: 15px;
    width: 400px;
    margin-left: 400px;
    box-shadow: 0 1px 4px 4px #ccc;
}
#Login img {
    margin-left: 80px;
}
#Login input[name="Username"] {
width: 250px;
border-radius: 
4px;
height: 30px;
background-color: #f2f2f2;
margin-top: 10px;
outline: 0;
margin-left: 75px;
text-indent: 10px;
border: 1px solid #ccc;

}
#Login input[name="Password"]{
    width: 250px;
    background-color: #f2f2f2;
    border-radius: 4px;
    height: 30px;
    text-indent: 10px;
    margin-top: 10px;
    border: 1px solid #ccc;
    outline: 0;
    margin-left: 75px;
}
#Login input[type="submit"] {
    width: 125px;
    height: 30px;
    margin-top:10px;
    background-color: #81BEF7;
    border-radius: 4px;
    border:1px solid #ccc;
    color: white;
    margin-left: 140px;
}
#Login input[type="submit"]:hover {

    background-color: #58ACFA;
}
 
  • Like
Reactions: Lindows
General chit-chat
Help Users
  • Chat Bot:
    QM|T has joined the room.
  • Chat Bot:
    Christo has joined the room.
  • Chat Bot:
    QM|T has joined the room.
  • Chat Bot:
    Christo has joined the room.
  • Chat Bot:
    SupraMaxG4mer69 is our newest member. Welcome!
  • Chat Bot:
    Hosestranger is our newest member. Welcome!
  • Chat Bot:
    bleks is our newest member. Welcome!
  • Chat Bot:
    bleks has posted a new reply in the thread "Console ID #8659".
  • Chat Bot:
    bleks has posted a new reply in the thread "Console ID #8659".
  • @ QM|T:
    :weed:
  • @ Fretyeco192321:
    Xzibit - Paparazzi
  • @ Fretyeco192321:
    that is a song
  • @ QM|T:
    i know lol
  • @ Fretyeco192321:
    I am getting a XBOX 360 today if anyone wanna give me advice on soft modding it for RGH purposes lemme know
  • @ Fretyeco192321:
    Also would like Online to work
  • @ Fretyeco192321:
    If it's anything like PS3 FileZilla I know all about that
  • Chat Bot:
    joejoejoe69 is our newest member. Welcome!
  • Chat Bot:
    RAZER_KAMO is our newest member. Welcome!
  • Chat Bot:
    QM|T has joined the room.
  • @ QM|T:
    hi
  • Chat Bot:
    ripp.kaori is our newest member. Welcome!
  • Chat Bot:
    keonhacai05com is our newest member. Welcome!
  • Chat Bot:
    Christo has joined the room.
      Chat Bot: Christo has joined the room.