css for additional content in twenty twelve footer

Hi again,

I would like to add in extra links into the footer of my twenty twelve child theme, and for it to be laid out like this:
1. copyright left align
2. site map | privacy center align
3. wordpress credits center align under the site map | privacy links (#2)
4. design credits right align
+ all in same line/block…
I’ve tried a number of variations in my style.css, currently like this:

/* another trial of adding extra credits/link in footer .... */
.site-info {
	display: block;
}
.site-info li {
	display: inline;
}
.copyright {
	text-align: left;
	float: left;
}
.site-credits, .wp-credits {
	text-align: center;
	float: none;
}
.web-thanks{
	text-align: right;
	float: right;
}

and footer.php, currently like this:

<div class="site-info">
			<ul class="copyright">
				<li><a href="http://www.example4.com/" target="_blank" title="http://www.example4.com/">copyright TP</a></li>
			</ul>
			<ul class="site-credits">
				<li><a href="http://www.example1.org/sitemap/" target="_blank" title="http://www.example1.org/sitemap/">site map</a> | <a href="http://www.example2.net/sitemap/" target="_blank" title="http://www.example2.net/sitemap/">privacy policy</a></li>
			</ul>
			<ul class="wp-credits">
				<li><?php do_action( 'twentytwelve_credits' ); ?>
			<a href="<?php echo esc_url( __( 'http://wordpress.org/', 'twentytwelve' ) ) .'"target="_blank"'; ?>" title="<?php esc_attr_e( 'Wordpress Publishing Platform', 'twentytwelve' ); ?>" rel="generator"><?php printf( __( 'Powered by %s', 'twentytwelve' ), 'WordPress' ); ?></a></li>
			</ul>
			<ul class="web-thanks">
				<li><a href="http://www.example5.org/" target="_blank" title="http://www.example5.org/">design credits</a></li>
			</ul>

		</div><!-- .site-info -->

based on a previous thread,but just can’t get them to work.

Any ideas where I’ve gone wrong??

Many thanks.