Quote icons
Moderator: General Moderators
-
alex.barylski
- DevNet Evangelist
- Posts: 6267
- Joined: Tue Dec 21, 2004 5:00 pm
- Location: Winnipeg
Quote icons
You know those really popular quotes you see on web sites which resemble something of an 6 or 9
6This is some quoted text9
Anyone know of an article on how those are made? I want to add them to my website...
6This is some quoted text9
Anyone know of an article on how those are made? I want to add them to my website...
- Christopher
- Site Administrator
- Posts: 13596
- Joined: Wed Aug 25, 2004 7:54 pm
- Location: New York, NY, US
- Ambush Commander
- DevNet Master
- Posts: 3698
- Joined: Mon Oct 25, 2004 9:29 pm
- Location: New Jersey, US
If what pickle thinks you are thinking is correct, I would recommend using this CSS:
Used as:
Code: Select all
blockquote.fancy {
background: transparent url(quote-left.png) left top no-repeat;
}
blockquote.fancy div.quote {
padding: .5em 48px .5em;
background: transparent url(quote-right.png) right bottom no-repeat;
}
blockquote.fancy div.origin {
text-align:right;
}Code: Select all
<blockquote class="fancy">
<div class="quote">The goodies!</div>
<div class="origin">-- by Someone</div>
</blockquote>-
alex.barylski
- DevNet Evangelist
- Posts: 6267
- Joined: Tue Dec 21, 2004 5:00 pm
- Location: Winnipeg
- Christopher
- Site Administrator
- Posts: 13596
- Joined: Wed Aug 25, 2004 7:54 pm
- Location: New York, NY, US
- Kieran Huggins
- DevNet Master
- Posts: 3635
- Joined: Wed Dec 06, 2006 4:14 pm
- Location: Toronto, Canada
- Contact:
- Ambush Commander
- DevNet Master
- Posts: 3698
- Joined: Mon Oct 25, 2004 9:29 pm
- Location: New Jersey, US
- Kieran Huggins
- DevNet Master
- Posts: 3635
- Joined: Wed Dec 06, 2006 4:14 pm
- Location: Toronto, Canada
- Contact:
