CSS Course - Build-a-Kitty Workshop

Developer
Veronika
Size
3,183 Kb
Views
46,552
  1. CSS Course - Build-a-Kitty Workshop Previews
  2. CSS Course - Build-a-Kitty Workshop HTML Codes
  3. CSS Course - Build-a-Kitty Workshop CSS Codes

How do I make an css course - build-a-kitty workshop?

Layout that I built when taking a CSS course at Women's Coding Collective. What is a css course - build-a-kitty workshop? How do you make a css course - build-a-kitty workshop? This script and codes were developed by Veronika on 30 November 2022, Wednesday.

CSS Course - Build-a-Kitty Workshop Previews
IQ Test

CSS Course - Build-a-Kitty Workshop - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>CSS Course - Build-a-Kitty Workshop</title> <link href='https://fonts.googleapis.com/css?family=Dosis' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <body> <nav> <h1>The Kitty Post</h1> <ul> <li><a href=#>Kibble Talk</a></li> <li><a href=#>Litter Letter</a></li> <li><a href=#>Flea Watch</a></li> <li><a href=#>Fur Clump Removal</a></li> </ul> </nav> <div id='wrapper'> <section id='column1'> <img src='https://practice-pixels.s3.amazonaws.com/kitten_200x125.jpg'> <h3>2016-01-02</h3> <h2>Today's events</h2> <p>Asdflkjaertvlkjasntvkjn (sits on keyboard) leave hair everywhere, or eat prawns daintily with a claw then lick paws clean wash down prawns with a lap of carnation milk.</p> <img src='https://practice-pixels.s3.amazonaws.com/kitten_250x250.jpg'> <h3>2016-01-01</h3> <h2>Yesterday's events</h2> <p>Pooping rainbow while flying in a toasted bread costume in space poop in litter box, scratch the walls. Chew on cable sit in box hide when guests come over hunt by meowing loudly at 5am.</p> </section> <section id='column2'> <h3>2015-12-29</h3> <h2>Big News in Kittentown</h2> <p>Stare at the wall, play with food and get confused by dust. Cats go for world domination climb leg. Climb a tree, wait for a fireman jump to fireman then scratch his face cat is love, cat is life eat prawns daintily with a claw then lick paws clean wash down prawns with a lap of carnation milk then retire to the warmest spot on the couch to claw at the fabric before taking a catnap or meowwww. </p> <img src='https://practice-pixels.s3.amazonaws.com/kitten_910x400.jpg'> <h2>About The Kitty Post</h2> <p>Cat is love, cat is life cat snacks, but cat is love, cat is life, stares at human while pushing stuff off a table eat grass, throw it back up and refuse to drink water except out of someone's glass. Cats go for world domination spot something, big eyes, big eyes, crouch, shake butt, prepare to pounce but attack feet, for knock dish off table head butt cant eat out of my own dish damn that dog plan steps for world domination lick plastic bags. Cat snacks lick butt, walk on car leaving trail of paw prints on hood and windshield white cat sleeps on a black shirt and play riveting piece on synthesizer keyboard lick sellotape for gnaw the corn cob.</p> </section> <section id='column3'> <img src='https://practice-pixels.s3.amazonaws.com/kitten_500x400.jpg'> <h3>2016-01-02</h3> <h2>Kitten of the day</h2> <p>Meowwww jump launch to pounce upon little yarn mouse, bare fangs at toy run hide in litter box until treats are fed and rub face on everything hunt anything that moves, and run in circles. </p> <img src='https://practice-pixels.s3.amazonaws.com/kitten_200x200.jpg'> </section> <footer> <div id='links'> <ul> <li><a href='#'>About Us</a></li> <li><a href='#'>Contact</a></li> <li><a href='#'>FAQ</a></li> <li><a href='#'>Adress</a></li> </ul> </div> </footer> </div>
</body>
</body>
</html>

CSS Course - Build-a-Kitty Workshop - Script Codes CSS Codes

*,
*:before,
*:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}
body { font-family: 'Dosis', sans-serif; background-color: #D1D8D7;
}
nav { position: fixed; top: 0; left: 0; width: 100%; min-width: 800px; height: 75px; background-color: #D1D8D7; padding-top: 10px; z-index: 10;
}
nav h1 { float: left; margin-top: 10px; margin-left: 40px;
}
h2 { margin-top: 0px;
}
h3 { margin: 0px; font-size: 15px;
}
nav ul { list-style-type: none; float: right;
}
nav li { display: inline; margin-right: 40px;
}
nav li a { text-decoration: none; color: black; padding-left: 4px; padding-right: 4px; font-size: 16px; -webkit-transition: background 500ms ease-in-out; -moz-transition: background 500ms ease-in-out; -ms-transition: background 500ms ease-in-out; -o-transition: background 500ms ease-in-out; transition: background 500ms ease-in-out;
}
nav li a:hover { background-color: #F7BEC3;
}
footer { width: 100%; clear: both;
}
#links { width: 200px; float: right; padding-bottom: 30px;
}
footer ul { text-align: right; list-style-type: none; padding:0px;
}
footer li { width: 100px; float: right;
}
footer li a { text-decoration: none; color: black; font-size: 15px; -webkit-transition: color 500ms ease-in-out; -moz-transition: color 500ms ease-in-out; -ms-transition: color 500ms ease-in-out; -o-transition: color 500ms ease-in-out; transition: color 500ms ease-in-out;
}
footer li a:hover { color: #C7646D;
}
#wrapper { width: 80%; min-width: 750px; margin: auto; margin-top: 100px; line-height: 1.5; border-bottom: 5px solid #99A5A3;
}
section { float: left; width: 27%; text-align: center; padding: 20px;
}
#column2 { width: 46%
}
img { width: 100%; padding-top: 15px; border-top: 5px solid #99A5A3; margin-top: 15px; margin-bottom: 15px;
}
CSS Course - Build-a-Kitty Workshop - Script Codes
CSS Course - Build-a-Kitty Workshop - Script Codes
Home Page Home
Developer Veronika
Username ivhed
Uploaded November 30, 2022
Rating 3
Size 3,183 Kb
Views 46,552
Do you need developer help for CSS Course - Build-a-Kitty Workshop?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Veronika (ivhed) Script Codes
Name
CSS Baby
SVG Snowflakes
CSS Filter Blur
FreeCodeCamp - Personal Portfolio
MorphSVG Fruit
Background blend mode
FreeCodeCamp - Javascript Calculator
CSS Course - Fluid layout
Space Game Button
FreeCodeCamp - Pomodoro Clock
Create amazing video scripts with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!