Custom CSS to centre side bar info

• 

  karenapickering · Member · Jan 18, 2015 at 4:57 am

  • Copy link
  • Add topic to favorites

  I have recently launched a blog called the Bridal Bible and would like to customise the widgets. As you can see the widget headings are centered but the information below the headings isn’t, making it look a little untidy. Does anyone have a code that I can use to:

  – center the image and text in the text widget (the first section of the sidebar)
  – email subscription button and main text
  – contact information in the footer.

  Any help would be greatly appreciated.

  Thanks :)

  Kaz

  The blog I need help with is: (visible only to logged in users)

• 

  staff-happychia · Staff · Jan 18, 2015 at 5:57 am

  • Copy link

  This style centers the text in any widget:

  .widget {
  text-align: center;
  }

  Please add it and let me know. :-)

• 

  karenapickering · Member · Jan 18, 2015 at 7:05 am

  • Copy link

  That worked, thank you, but it didn’t center the image.

• 

  staff-happychia · Staff · Jan 18, 2015 at 8:08 am

  • Copy link

  I think the images on the widgets are already centered.

• 

  designsimply · Member · Jan 18, 2015 at 1:19 pm

  • Copy link

  I think the images look centered because they are max-width for the size of the sidebar container at the moment.

  I noticed some of the images, such as the instagram shot with the to do list in it, are not centered. To force all images in all of the widgets to be centered, you can add this to your Appearance > Customize > CSS editor:

  .widget img {
  	display: block;
  	float: none;
  	margin: 0 auto;
  }