Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <title>FindThePrecious</title>
- <meta charset="UTF-8">
- <meta name="author" content="Lionel">
- <meta name="description"
- content="A website to look for a bunch of fellows">
- <meta name="viewport"
- content="width=device-width, initial-scale=1.0">
- <link rel="stylesheet" href="style.css">
- </head>
- <body>
- <nav>
- <ul>
- <li class="a">FindThePrecious.com</li>
- <li class="a">Fellows</li>
- <li class="a">Contact us</li>
- </ul>
- </nav>
- <section>
- <div class="carousel"></div>
- </section>
- <section>
- <h2 class=fellows>Fellows wanted dead (or alive
- if you want to eat them later)</h2>
- </section>
- <section id=art>
- <article></article>
- <article></article>
- <article></article>
- </section>
- <hr>
- <form>
- <h2 id="contactus">Contact us</h2>
- <input type="email" placeholder="@">
- <input type="text" placeholder="⌂">
- <input type="text"
- placeholder="I have seen one of them">
- <textarea placeholder="Your message"></textarea>
- </form>
- </body>
- </html>
- -------------------------------------------------------------------------------------------------------
- nav{
- height: 40px;
- background-color:#3a3a3a;
- }
- ul {
- list-style: none;
- margin: 0;
- }
- li {
- display: inline-block;
- color: white;
- margin-right: 20px;
- margin-top:10px;
- }
- .carousel {
- background-color:lightgrey;
- height: 150px;
- width: 100%
- }
- article{
- display: inline-block;
- width: 400px;
- height: 300px;
- background:lightgrey;
- }
- #art {
- text-align:center;
- }
- h2 {
- font-size: 18px;
- }
- input, textarea{
- width: 80%;
- margin: 0 auto;
- display: block;
- margin-top: 10px;
- }
- #contactus {
- text-align: left;
- }
- .fellows {
- text-align: center;
- }
- @media (max-width:961px) {#art,.carousel{display: none;}}
- @media (max-width:961px) {.fellows{font-size: 23px;}}
- @media (max-width:961px) {#contactus{text-align: center;}}
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement