April 23, 2007

Pullquote CSS

Here's the sample CSS for the new [pullquote] tag. Note that the rainbow scheme is meant as an example, and not as something I'd recommend anyone actually use.

.pullquote-right {
float:right;
width:150px;
padding-bottom:10px;
margin:10px;
font-size: 1.3em;
line-height:100%;
text-align: right;
}

.pullquote-left {
float:left;
width:150px;
padding-bottom:10px;
margin:10px;
font-size: 1.3em;
line-height:100%;
text-align: left;
}

.pullquote-default-1,.pullquote-default-5 { color: silver; }
.pullquote-default-2,.pullquote-default-4 { color: darkgrey; }

.pullquote-rainbow-1 { color: red; }
.pullquote-rainbow-2 { color: orange; }
.pullquote-rainbow-3 { color: green; }
.pullquote-rainbow-4 { color: blue; }
.pullquote-rainbow-5 { color: purple; }

.pullquote-blue-1,.pullquote-blue-5 { color: #55D; }
.pullquote-blue-2,.pullquote-blue-4 { color: #339; }
.pullquote-blue-3 { color: #004; }

.pullquote-red-1,.pullquote-red-5 { color: #800; }
.pullquote-red-2,.pullquote-red-4 { color: #B00; }
.pullquote-red-3 { color: red; }

.pullquote-orange-1,.pullquote-orange-5 { color: #840; }
.pullquote-orange-2,.pullquote-orange-4 { color: #B60; }
.pullquote-orange-3 { color: #F80; }

.pullquote-green-1,.pullquote-green-5 { color: darkgreen; }
.pullquote-green-2,.pullquote-green-4 { color: forestgreen; }
.pullquote-green-3 { color: limegreen; }

.pullquote-purple-1,.pullquote-purple-5 { color: indigo; }
.pullquote-purple-2,.pullquote-purple-4 { color: purple; }
.pullquote-purple-3 { color: mediumpurple; }

Posted by: Pixy Misa at 04:11 PM | No Comments | Add Comment
Post contains 163 words, total size 2 kb.

Comments are disabled. Post is locked.
9kb generated in CPU 0.02, elapsed 0.0148 seconds.
29 queries taking 0.0073 seconds, 51 records returned.
Powered by Minx 1.1.6c-pink.