nixgadgetsHi all,
I know this is a very common question but none of tricks and tips I have tried to align the "read more" link to the right has worked. In my case its "CONTINUE READING ..." as given on the homepage of my site nixgadgets.vacau.com. I have read dozens of forum posts on this thing and couldnt find a work around.
I have tried the following fixes.
1. The only work around I have found was to add a margin as,
margin: 0px 50px 20px !important; in to the more-link class but I have read some where that this may not be handled well on certain browsers.
2. I have tried adding float:right; while this shifts to the right because the more link is wrapped in p tags it seems to increase the height of its background. Not very clean !
3. Also tried adding display:block;text-align:right; which causes the background to stretch even though it aligns the text to the right.
My more-link css looks like,
.post-content p{margin:0 0 .8em 0;padding:0;}
.post-content a.more-link{background-color:#eee;text-decoration:none;color:#666;text-shadow:#fff 1px 1px 1px;padding:2px 6px 3px 6px;margin:0;font-size:85%;text-transform:uppercase;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;}
.post-content a.more-link:hover{background-color:#999;color:#fff;text-shadow:#666 1px 1px 1px;}
.post-content a.more-link.loading{border:0;margin:0 4px;padding:3px 8px;border:0;background:transparent url(images/loader-white.gif) no-repeat center center;}If you know any other way of fixing please let me know.
