How to center text and place it above a thumbnail image

• 

  heubs77 · Member · Jun 8, 2017 at 5:04 pm

  • Copy link
  • Add topic to favorites

  ok

  I have a series of blog posts on my site http://www.saskawatch.com . I have a series of blog posts down the right hand side of the page. I was wondering if I could somehow post the title of the blog post above the image itself and have it centered rather than below and not centered?

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

• 

  thesacredpath · Member · Jun 8, 2017 at 9:57 pm

  • Copy link

  Hi, add the following to the bottom of your custom CSS and see what you think.

  #sidebar .display-posts-listing {
  	margin-left: 0;
  	padding-left: 0;
  }
  #sidebar .listing-item {
  	display: flex;
  	display: -webkit-box;
  	display: -moz-box;
  	display: -ms-flexbox;
  	display: -webkit-flex;
  	-webkit-flex-direction: column;
  	-moz-flex-direction: column;
  	-ms-flex-direction: column;
  	flex-direction: column;
  	-webkit-box-orient: vertical;
  	-moz-box-orient: vertical;
  	-ms-box-orient: vertical;
  	box-orient: vertical;
  }
  #sidebar .listing-item .title {
  	-webkit-box-ordinal-group: 1;
  	-moz-box-ordinal-group: 1;
  	-ms-flex-order: 1;
  	-webkit-order: 1;
  	order: 1;
  	text-align: center;
  }
  #sidebar .listing-item .image {
  	-webkit-box-ordinal-group: 2;
  	-moz-box-ordinal-group: 2;
  	-ms-flex-order: 2;
  	-webkit-order: 2;
  	order: 2;
  	text-align: center !important;
  	margin-right: 0;
  }

• 

  heubs77 · Member · Jun 9, 2017 at 1:01 am

  • Copy link

  That works perfectly. Should I erase the previous stuff, or …. if it works, just leave it there?

• 

  thesacredpath · Member · Jun 9, 2017 at 4:51 am

  • Copy link

  Take out the text-align: center and leave the list style and weight in that rule.