A Pen by Ashley Ellis on CodePen.
Created
January 23, 2015 02:01
-
-
Save aellispierce/76211fc5feefab3dcf13 to your computer and use it in GitHub Desktop.
OPgPEq
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div id = "page"> | |
<div id = "Whole_thing"> | |
<h1> Shakespeare's Sonnet #18 </h1> | |
<p id= "intro"> This is one of the most famous of the sonnets. It is referenced in the film dead poets society and gave names to the band The Darling Buds and the book and the television series The Darling Buds of May. Read it and weep! | |
<div id= "Sonnet"> | |
<p>Shall I compare thee to a summer's day?</p> | |
<p>Thou art more lovely and more temperate:</p> | |
<p>Rough winds do shake the darling buds of May,</p> | |
<p>And summer’s lease hath all too short a date;</p> | |
<p>Sometime too hot the eye of heaven shines,</p> | |
<p>And often is his gold complexion dimm'd;</p> | |
<p>And every fair from fair sometime declines,</p> | |
<p>By chance or nature’s changing course untrimm'd;</p> | |
<p>But thy eternal summer shall not fade,</p> | |
<p>Nor lose possession of that fair thou ow’st;</p> | |
<p>Nor shall death brag thou wander’st in his shade,</p> | |
<p>When in eternal lines to time thou grow’st:</p> | |
<p>So long as men can breathe or eyes can see,</p> | |
<p>So long lives this, and this gives life to thee</p> | |
</div> | |
<p id= "ending"> See the <a href= "http://en.wikipedia.org/wiki/Shakespeare%27s_sonnets"> Shakespeare's Sonnet </a> Wikipedia article for more information. </p> | |
</div> | |
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
body { | |
background-color: #E2AC7F; | |
} | |
#page { | |
width: 570px ; | |
margin-left: auto ; | |
margin-right: auto ; | |
} | |
h1 { | |
text-align: center; | |
border-bottom: 4px dashed black; | |
font-style: italic; | |
font-family: "Impact"; | |
} | |
#Whole_thing { | |
border: 4px dashed black; | |
background-color: #F5F5DC; | |
} | |
#intro { | |
padding-left: 20px; | |
padding-right: 20px; | |
font-family: "Helvetica"; | |
} | |
#Sonnet{ | |
text-align: center; | |
font-style: italic; | |
font-family: "Helvetica" | |
} | |
#Sonnet p{ | |
margin: 0; | |
padding: 0; | |
} | |
#Sonnet p::first-letter { | |
font-size: 120%; | |
/* font-family: "Lucida Sans Typewriter"*/ | |
} | |
#ending { | |
text-align: center; | |
font-size: 80%; | |
} | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment