Centering image gallery

• 

  chasingthenichols · Member · Mar 22, 2016 at 12:59 am

  • Copy link
  • Add topic to favorites

  I’m so close at figuring this out.. On my page “the essentials” I have a couple dozen images that will all be links to external pages. Everything is pretty close to how I want it except the whole group of images is slightly off center. They are a bit to the left. It is like this on mobile as well. I’m sure it’s an easy fix but I just can’t seem to figure it out. Any help would be greatly appreciated! This is the custom CSS I have for that page and the mobile page..

  /* Image gallery adjustments */
  .page-id-90 .wp-caption {
  background: inherit;
  max-width: 18% !important;
  display: inline-block;
  text-align: center;
  vertical-align: top;
  width: 18% !important;
  }

  .page-id-90 .wp-caption img[class*=”wp-image-“] {
  height: 120px;
  width: auto;
  max-width: 100%;
  }

  @media screen and (max-width: 767px) {
  .page-id-90 .wp-caption {
  width: 48% !important;
  max-width: 48% !important;
  }

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

• 

  thesacredpath · Member · Mar 22, 2016 at 2:12 am

  • Copy link

  In this CSS rule
  .page-id-90 .wp-caption
  set max-width to 19% and for width, make that 100% so that it looks like this.

  .page-id-90 .wp-caption {
      background: inherit;
      display: inline-block;
      max-width: 19% !important;
      text-align: center;
      vertical-align: top;
      width: 100% !important;
  }

• 

  chasingthenichols · Member · Mar 22, 2016 at 3:34 am

  • Copy link

  Thank you thank you!! I was just about to fall asleep when a saw your response, so I had to get out of bed and try it out! Ended up setting to 19.4%! And I was able to tweak the mobile code a bit. It’s been a long day of pulling out hairs :o Thank you so much for your help!!

• 

  thesacredpath · Member · Mar 22, 2016 at 8:14 pm

  • Copy link

  Awesome, and you are welcome, and don’t pull out too many hairs before asking. :)