I've been working on my first WordPress site (yay!) and I'm using the new 2012 theme. There isn't an option to put widgets in the footer, so I added a sidebar, and my text randomly got pushed to the side. Site: http://www.rachelsilberman.com/dan-krokos/
If you look in Chrome it's centered, but make the page smaller and it scales to the right side. I put the text in a div called footer-name. I feel like there's a float:left that's happening somewhere, or something that's overwriting the footer style.
The CSS I'm using
footer[role="contentinfo"] {
border-top: 1px solid #ededed;
clear: both;
font-size: 12px;
font-size: 0.857142857rem;
line-height: 2;
max-width: 960px;
max-width: 68.571428571rem;
margin-top: 24px;
margin-top: 1.714285714rem;
margin-left: auto;
margin-right: auto;
padding: 24px 0;
padding: 1.714285714rem 0;
background-color: #E3E3E3;
}
footer[role="contentinfo"] a {
color: #686868;
}
footer[role="contentinfo"] a:hover {
color: #55abe8;
}
#footer-name{
display: block;
margin-left: auto;
margin-right: auto;
background-color: aqua;
}
#footer-sidebar {
display:block;
height: 30px;
}
#footer-sidebar1 {
width: 300px;
margin-left: auto;
margin-right: auto;
}
The footer I wrapped the div in (via footer.php)
<div id="footer-name">
<a href="<?php echo esc_url( __( 'http://rachelsilberman.com/', 'twentytwelve' ) ); ?>" title="<?php esc_attr_e( 'Semantic Personal Publishing Platform', 'twentytwelve' ); ?>"><?php printf( __( 'Website created by %s', 'twentytwelve' ), 'Rachel Silberman' ); ?></a>
</div>
and the code that I used to make the extra sidebar located in the functions.php.
register_sidebar( array(
'name' => __( 'Footer', 'twentytwelve' ),
'id' => 'sidebar-2',
'description' => __( 'Appears on footer', 'twentytwelve' ),
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget' => '</aside>',
'before_title' => '<h3>',
'after_title' => '</h3>',
) );
if u want the footer text to be centered u can try this
div#footer-name {
background-color: aqua;
display: block;
margin-left: auto;
margin-right: auto;
text-align: center; // added this line
}