Melitta Bentz Tribute Page

In this example below you will see how to do a Melitta Bentz Tribute Page with some HTML / CSS and Javascript

Thumbnail
This awesome code was written by auntjeanne1775, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright auntjeanne1775 ©

Technologies

  • HTML
  • CSS
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>Melitta Bentz Tribute Page</title>
  
  
  <link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css'>

      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>

  <head>
<link href="https://fonts.googleapis.com/css?family=Pompiere|Raleway" rel="stylesheet">
</head>
<body>
<div class ="container">
  <div class = "page-header">
    <h1><center> Melitta Bentz</center></h1>
    <h2><center>She came with coffee, like the morn<h2></center>
  </div>
      <center><img src="https://upload.wikimedia.org/wikipedia/commons/7/76/Melitta_Bentz.jpg" class="img-responsive" alt="Responsive image" width = 20%></center>
      <p>
        Do you find your morning java has a sharp taste and distinctly "gritty" texture, like bitter sandy mud after a rainstorm?
      </p>
      <p>
        If not, you can thank the inventive Melitta Bentz, who in 1908 grew frustrated with the results she got brewing coffee by dropping the grounds in hot water tied up in a fabric bag. She solved the problem by punching some holes in the bottom of a copper pot, and lining it with blotting paper from her son's textbook.
      </p>
      <p><em>
Just on the off chance that someday there may be a reader of this webpage who didn't go to Hogwarts and therefore never did homework with a feather and inkpot, I'll mention here that blotting paper is particularly absorbant compared to regular paper.
      </em></p>
      <p>
       She then added the coffee to the copper pot, placed it over another pot, and poured the hot water through it - providing the much milder filtered cup of caffinated bliss that keeps us from stabbing each other on the street today.
      </p>
      <h3><center>
      Read More about Melitta and Her Company
      </h3><center>
      <button a href="https://en.wikipedia.org/wiki/Melitta_Bentz" a target="_blank" type="button" class="btn btn-primary btn-lg">On Wikipedia</button>
      <button a href="https://www.melitta.com/en/Melitta-Journey-through-time-1703.html" type="button" class="btn btn-primary btn-lg">On the Melitta Company Website</button>
      <br><br>
   </div>
 </body>
  
  

</body>

</html>

/*Downloaded from https://www.codeseek.co/auntjeanne1775/melitta-bentz-tribute-page-BWydVR */

h1{
  font-family: 'Pompiere', cursive;
  font-size: 400%;
  color: brown;
  margin: 0;
}
h2{
  font-family: 'Raleway', sans-serif;
  color: tan;
  margin: 0;
}
h3{
  font-family: 'Pompiere', cursive;
  color: brown;
}
body{
  font-family: 'Raleway', sans-serif; 
  width: 66%;
  margin: auto;
}

Comments