Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- * {
- box-sizing: border-box;
- }
- /* Style the header */
- header {
- background-color: #666;
- padding: 5px;
- text-align: center;
- font-size: 16px;
- color: white;
- }
- /* Create two columns/boxes that floats next to each other */
- nav {
- float: left;
- width: 20%;
- height: 90vh;
- background: #ccc;
- padding: 20px;
- }
- /* Style the list inside the menu */
- nav ul {
- list-style-type: none;
- padding: 0;
- }
- nav ul li a{
- text-decoration: none;
- }
- article {
- float: left;
- padding: 10px;
- width: 80%;
- background-color: #f1f1f1;
- height: 90vh;
- }
- /* Clear floats after the columns */
- section:after {
- content: "";
- display: table;
- clear: both;
- }
- /* Style the footer */
- footer {
- background-color: #777;
- padding: 10px;
- text-align: center;
- color: white;
- }
- input[type=text] {
- width: 50%;
- padding: 5px ;
- display: inline-block;
- border: 1px solid #ccc;
- border-radius: 4px;
- box-sizing: border-box;
- }
- @media (max-width: 600px) {
- nav, article {
- width: 100%;
- height: auto;
- }
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement