Centering images using CSS

• 

  journeyingthroughthebible · Member · Dec 11, 2017 at 6:08 pm

  • Copy link
  • Add topic to favorites

  Hi I have just upgraded to Twenty Sixteen theme (from Twenty Ten). I find that (where they do not already fill the screen from left to right), images float left, rather than center. I used to use HTML to achieve centering of each individual image: below is an example of the aligncenter function I was using. But this doesn’t work on Twenty Sixteen, although it did on Twenty Ten. Here is the example:
  <img class=”aligncenter size-medium wp-image-770″ alt=”Vaughan Roberts’ ‘God’s Big Picture'” src=”http://creationtonewcreation.files.wordpress.com/2013/11/cover-for-roberts-v-gods-big-picture.jpg?w=191″ width=”191″ height=”300″ />
  How can I achieve centering on TwentySixteen? Can I do this for individual images, or have I got to do this using one CSS code for all images that don’t stretch from left to right margins? Many thanks, Rob

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

• 

  journeyingthroughthebible · Member · Dec 11, 2017 at 6:27 pm

  • Copy link

  Hi
  I have now localised the problem specifically to images that have an associated download. For example, I use PDF button image so a user can click it to download a document. These PDF button images centered correctly on Twenty Ten but not on Twenty Sixteen. In TwentyTen the text paragraph tag text-align:center centered the image; on Twenty Sixteen it doesn’t. The solution I found is to change the image tag from alignnone (as seen below, in bold) to aligncenter. The PDF button then centers correctly.

  5x Cataclysm and Covenant

  <p style=”text-align:center;margin-bottom:-15px;”><img class=”alignnone size-full wp-image-1134″ src=”http://creationtonewcreation.files.wordpress.com/2014/06/fotolia_33551558_s-e1402351456692.jpg” alt=”” width=”100″ height=”64″ /></p>

• 

  sfmerv · Member · Dec 11, 2017 at 10:02 pm

  • Copy link

  Have you found a solution for this or are still looking for help?

  From your second post it looks like you got it covered.

• 

  journeyingthroughthebible · Member · Dec 11, 2017 at 10:33 pm

  • Copy link

  Hi
  Thank you for your reply to this – yes, I think this is the solution. I think this HTML code is the way to go as this enables me to specify the position of each image individually – CSS would, I guess, be a global solution for all images, which I don’t want.
  Many thanks again, Rob

• 

  sfmerv · Member · Dec 11, 2017 at 10:46 pm

  • Copy link

  right on