Using div to create quotation box : Quotation « CSS Controls « HTML / CSS

HTML / CSS » CSS Controls » Quotation 
Using div to create quotation box
 
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css" media="screen">
body {background: #C0FFEE; font: 1em Georgia, serif; padding: 1em 5%;}
.quotebox {font-size: 195%; padding: 80px 80px 40px; width: 16em; margin: 2em auto; border: 2px solid #8D7961; background: #FFF;}
.quotebox span {font-style: italic; font-size: smaller; display: block; margin-top: 0.5em; text-align: right;}

</style>
</head>
<body>

<div class="main">

<div class="quotebox">
One&#8217;s mind has a way of making itself up in the background, and it suddenly becomes clear what one means to do.
<span>&#8212;Arthur Christopher Benson</span>
</div>

</div>

</body>
</html>

   
  
Related examples in the same category
1.Text wraps quotations
2.Quotation style
3.Quotations
4.Quotation with quotation mark image
5.Sidebar with links, text and quotations
6.Quotation with background
7.Quotation with left bar
8.Quotation with quotation mark
9.Quotation Example
10.Using content property to add quotation marks to blockquote
11.Content and quotation
12.Quotation on the right, wrap with text
13.Paragraph wraps around quotation
14.Using classes and CSS overrides to create an alternate pull quote
15.Creating pull quotes in CSS
16.Quote with border
java2s.com  | Contact Us | Privacy Policy
Copyright 2009 - 12 Demo Source and Support. All rights reserved.
All other trademarks are property of their respective owners.