Posted by flickerfly on June 19, 2008 at 11:53pm
Jump to:
| Project: | jQuery Eye Candy |
| Version: | 6.x-1.x-dev |
| Component: | User interface |
| Category: | support request |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | closed (fixed) |
Issue Summary
I have applied the gradient and curvy corners to the blocks in the right column here: http://members.fim.org. It works nicely, but I can't seem to come up with a way to tell anything in a paragraph tag to stay away from the edge without causing the content to expand and become wider that the curvy graphics above and below it. This makes it look stupid, but being up against the edge looks stupid too.
Anyone fought this battle and won yet?
Here's the code for CurvyCorners:
$(function(){
$('.block .content')
.corner({
tl: false,
tr: false,
bl: { radius: 20 },
br: { radius: 20 },
antiAlias: true,
autoPad: true
});
$('.block .title')
.corner({
tl: {radius: 16 },
tr: {radius: 16 },
bl: false,
br: false,
antiAlias: true,
autoPad: true
});
});and here's the code for gradient:
$(function() {
$('#userAgent').html(navigator.userAgent);
$('#main #sidebar-right .block .title').gradient({
from: '50B7DD',
to: '0288B8',
direction: 'horizontal'
});
$('#main #sidebar-right .block .content').gradient({
from: '0288B8',
to: '50B7DD',
direction: 'horizontal'
});
});
Comments
#1
Did you try margins in your css? Padding should work too. And try it in style.css after you found the block id using firebug.
#2
Doh, I must be off my game a bit. I thought for sure I'd done it, but it worked this time and didn't before. Thanks!
#3
#4
Automatically closed -- issue fixed for two weeks with no activity.