<!DOCTYPE html>
<html lang="en">
<head>
<link href="styles.css" rel="stylesheet" type="text/css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@500&display=swap" rel="stylesheet">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>KitchenKween.com</title>
</head>
<body>
<header>
<h1>Kitchen Kween's Chocolate Chip Cookies</h1>
<nav>
<a href="recipeindex.html"><img src="logo.png" alt="logo" class="logo"></a>
<ul>
<li><a href="recipeindex.html">HOME</a></li>
<li><a href="#">ABOUT THE KWEEN </a></li>
<li><a href="#">RECIPES</a></li>
<li><a href="#">CONTACT ME</a></li>
</ul>
</nav>
</header>
<main>
<section id="recipe">
<h2>Kitchen Kween's Famous Chocolate Chip Cookies</h2>
<h3>Makes 36 cookies</h3>
<img src="cookie.jpg" alt="cookie picture">
<p>There's nothing like the feeling of coming home from school and smelling mom's sweet, delicious chocolate chip cookies. There's a reason they are America's favorite cookie. This recipe is absolutely divine, now lets dig in and get to baking!</p>
<h2>Tips from the Kween</h2>
<p>HOW TO MAKE THE BEST CHOCOLATE CHIP COOKIE RECIPE EVER (HOW TO MAKE EASY COOKIES FROM SCRATCH):
Like I said, these cookies are crazy easy, however here are a few notes.
<html lang="en">
<head>
<link href="styles.css" rel="stylesheet" type="text/css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@500&display=swap" rel="stylesheet">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>KitchenKween.com</title>
</head>
<body>
<header>
<h1>Kitchen Kween's Chocolate Chip Cookies</h1>
<nav>
<a href="recipeindex.html"><img src="logo.png" alt="logo" class="logo"></a>
<ul>
<li><a href="recipeindex.html">HOME</a></li>
<li><a href="#">ABOUT THE KWEEN </a></li>
<li><a href="#">RECIPES</a></li>
<li><a href="#">CONTACT ME</a></li>
</ul>
</nav>
</header>
<main>
<section id="recipe">
<h2>Kitchen Kween's Famous Chocolate Chip Cookies</h2>
<h3>Makes 36 cookies</h3>
<img src="cookie.jpg" alt="cookie picture">
<p>There's nothing like the feeling of coming home from school and smelling mom's sweet, delicious chocolate chip cookies. There's a reason they are America's favorite cookie. This recipe is absolutely divine, now lets dig in and get to baking!</p>
<h2>Tips from the Kween</h2>
<p>HOW TO MAKE THE BEST CHOCOLATE CHIP COOKIE RECIPE EVER (HOW TO MAKE EASY COOKIES FROM SCRATCH):
Like I said, these cookies are crazy easy, however here are a few notes.
Soften butter. If you are planning on making these, take the butter out of the fridge first thing in the morning so it’s ready to go when you need it.
Measure the flour correctly. Be sure to use a measuring cup made for dry ingredients (NOT a pyrex liquid measuring cup). There has been some controversy on how to measure flour. I personally use the scoop and shake method and always have (gasp)! It’s easier and I have never had that method fail me. Many of you say that the only way to measure flour is to scoop it into the measuring cup and level with a knife. I say, measure it the way you always do. Just make sure that the dough matches the consistency of the dough in the photos in this post.
Use LOTS of chocolate chips. Do I really need to explain this?!
DO NOT over-bake these chocolate chip cookies! I explain this more below, but these chocolate chip cookies will not look done when you pull them out of the oven, and that is GOOD.</p>
<h2>Equipment</h2>
<ul>
<li>Measuring Spoons</li>
<li>Measuring Cups</li>
<li>Mixer</li>
<li>Spatula</li>
<li>Baking Sheet</li>
</ul>
<h2>Ingredients</h2>
<ul>
<li>1 CUP SALTED BUTTER (softened)</li>
<li>1 CUP WHITE SUGAR</li>
<li>1 CUP BROWN SUGAR</li>
<li>2 TSP VANILLA EXTRACT</li>
<li>2 LARGE EGGS</li>
<li>3 CUPS FLOUR</li>
<li>1 TSP BAKING SODA</li>
<li>1/2 TSP BAKING POWDER</li>
<li>2 CUPS CHOCOLATE CHIPS (or chunks)</li>
</ul>
<h2>Instructions</h2>
<ol type="1">
<li>Preheat oven to 375 degrees F. Line a baking pan with parchment paper and set aside.</li>
<li>In a separate bowl mix flour, baking soda, salt, baking powder. Set aside.
<li>Cream together butter and sugars until combined.</li>
<li>Beat in eggs and vanilla until fluffy.</li>
<li>Mix in the dry ingredients until combined.</li>
<li>Add 12 oz package of chocolate chips and mix well.</li>
<li>Roll 2-3 TBS (depending on how large you like your cookies) of dough at a time into balls and place them evenly spaced on your prepared cookie sheets. (alternately, use a small cookie scoop to make your cookies).</li>
<li>Bake in preheated oven for approximately 8-10 minutes. Take them out when they are just BARELY starting to turn brown.</li>
<li>Let them sit on the baking pan for 2 minutes before removing to cooling rack and ENJOY</li>
</ol>
<h2>Nutritional Facts</h2>
<p>Serving: 1 cookie (using 3 TBS dough)
Calories: 183kcal Carbohydrates: 26g Protein: 2g Fat: 8g Saturated Fat: 5g Cholesterol: 27mg
</p>
<button onClick="window.print()">PRINT RECIPE
</button>
</section>
</main>
<footer>
<small>For Educational Purposes only</small>
</footer>
</body>
</html>
Measure the flour correctly. Be sure to use a measuring cup made for dry ingredients (NOT a pyrex liquid measuring cup). There has been some controversy on how to measure flour. I personally use the scoop and shake method and always have (gasp)! It’s easier and I have never had that method fail me. Many of you say that the only way to measure flour is to scoop it into the measuring cup and level with a knife. I say, measure it the way you always do. Just make sure that the dough matches the consistency of the dough in the photos in this post.
Use LOTS of chocolate chips. Do I really need to explain this?!
DO NOT over-bake these chocolate chip cookies! I explain this more below, but these chocolate chip cookies will not look done when you pull them out of the oven, and that is GOOD.</p>
<h2>Equipment</h2>
<ul>
<li>Measuring Spoons</li>
<li>Measuring Cups</li>
<li>Mixer</li>
<li>Spatula</li>
<li>Baking Sheet</li>
</ul>
<h2>Ingredients</h2>
<ul>
<li>1 CUP SALTED BUTTER (softened)</li>
<li>1 CUP WHITE SUGAR</li>
<li>1 CUP BROWN SUGAR</li>
<li>2 TSP VANILLA EXTRACT</li>
<li>2 LARGE EGGS</li>
<li>3 CUPS FLOUR</li>
<li>1 TSP BAKING SODA</li>
<li>1/2 TSP BAKING POWDER</li>
<li>2 CUPS CHOCOLATE CHIPS (or chunks)</li>
</ul>
<h2>Instructions</h2>
<ol type="1">
<li>Preheat oven to 375 degrees F. Line a baking pan with parchment paper and set aside.</li>
<li>In a separate bowl mix flour, baking soda, salt, baking powder. Set aside.
<li>Cream together butter and sugars until combined.</li>
<li>Beat in eggs and vanilla until fluffy.</li>
<li>Mix in the dry ingredients until combined.</li>
<li>Add 12 oz package of chocolate chips and mix well.</li>
<li>Roll 2-3 TBS (depending on how large you like your cookies) of dough at a time into balls and place them evenly spaced on your prepared cookie sheets. (alternately, use a small cookie scoop to make your cookies).</li>
<li>Bake in preheated oven for approximately 8-10 minutes. Take them out when they are just BARELY starting to turn brown.</li>
<li>Let them sit on the baking pan for 2 minutes before removing to cooling rack and ENJOY</li>
</ol>
<h2>Nutritional Facts</h2>
<p>Serving: 1 cookie (using 3 TBS dough)
Calories: 183kcal Carbohydrates: 26g Protein: 2g Fat: 8g Saturated Fat: 5g Cholesterol: 27mg
</p>
<button onClick="window.print()">PRINT RECIPE
</button>
</section>
</main>
<footer>
<small>For Educational Purposes only</small>
</footer>
</body>
</html>
-----CSS---------
*{
margin:0px;
padding:0px;
box-sizing: border-box;
font-family: 'Raleway', sans-serif;
}
header {
width: 80%;
margin: 0 auto;
padding-top:10px;
}
margin:0px;
padding:0px;
box-sizing: border-box;
font-family: 'Raleway', sans-serif;
}
header {
width: 80%;
margin: 0 auto;
padding-top:10px;
}
.logo{
float:left;
width: 200px;
height:160px;
padding: 5px 0;
margin-left:10px;
}
h1{
visibility: hidden;
height:0;
}
float:left;
width: 200px;
height:160px;
padding: 5px 0;
margin-left:10px;
}
h1{
visibility: hidden;
height:0;
}
nav {
display: flex;
justify-content: space-around;
}
nav ul {
flex:1;
margin: 0;
padding:10px;
list-style: none;
}
justify-content: space-around;
}
nav ul {
flex:1;
margin: 0;
padding:10px;
list-style: none;
}
nav li {
display:inline-block;
margin-left:50px;
padding-top: 5px;
}
display:inline-block;
margin-left:50px;
padding-top: 5px;
}
nav li a {
color:purple;
text-decoration:none;
text-transform: uppercase;
font-size:15px;
background-color:white;
color:purple;
text-decoration:none;
text-transform: uppercase;
font-size:15px;
background-color:white;
}
nav li a:hover{
color:navy;
}
h2{
position: sticky;
color: darkblue;
}
main{
background-color:antiquewhite;
padding:40px;
}
p{
font-size:15px;
}
footer{
text-align:center;
}
@media screen and (min-width:790px){
nav li a {
font-size: 20px;
}
img{
height:280px;
width:280px;
}
}
@media screen and (max-width: 790px){
.logo{
height:130px;
width:150px;
}
nav li a {
font-size:15px;
color:navy;
}
h2{
position: sticky;
color: darkblue;
}
main{
background-color:antiquewhite;
padding:40px;
}
p{
font-size:15px;
}
footer{
text-align:center;
}
@media screen and (min-width:790px){
nav li a {
font-size: 20px;
}
img{
height:280px;
width:280px;
}
}
@media screen and (max-width: 790px){
.logo{
height:130px;
width:150px;
}
nav li a {
font-size:15px;
}
img {
height:210px;
width:210px;
}
}
@media print{
*{
border:black 1px;
background:transparent;
padding:0;
}
header, nav, footer{
visibility: hidden;
background-color:white;
height:0;
}
header:after {
content: "www.KitchenKween.com";
}
main{
background-color:white;
font-size:12px;
color:black;
}
p{
font-size:10.5px;
}
img{
height:100px;
width:100px;
}
button{
visibility:hidden;
}
img {
height:210px;
width:210px;
}
}
@media print{
*{
border:black 1px;
background:transparent;
padding:0;
}
header, nav, footer{
visibility: hidden;
background-color:white;
height:0;
}
header:after {
content: "www.KitchenKween.com";
}
main{
background-color:white;
font-size:12px;
color:black;
}
p{
font-size:10.5px;
}
img{
height:100px;
width:100px;
}
button{
visibility:hidden;
}
}
