Images on Mobile iPhone Needs to be Fixed

• 

  jaxfreeblog · Member · May 16, 2017 at 1:47 am

  • Copy link
  • Add topic to favorites

  Hello,

  On mobile, the images need to be resized. Is there a way to have the picture take up the majority of the width of the screen with the title underneath?

  Thanks!

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

• 

  hawaiiwp · Member · May 16, 2017 at 9:31 am

  • Copy link

  Hi again,

  Try this code, I think it works at all screen sizes.

  When using @media css to target specific screen sizes, the order does matter so @media (max-width: 1000px) entries should be above @media (max-width: 900px), etc. This code should work at the end of your css file unless you have a lot of other customizations.

  @media (max-width: 767px) {
  .blog article:not(.apostrophe-featured) .entry-header {
  width: 100%;
  float:none;
  padding-top: 5px;
  }
  .blog article:not(.apostrophe-featured) .entry-thumbnail {
  width: 100%;
  float:none;
  }
  }

  :)
  arlen

• 

  jaxfreeblog · Member · May 16, 2017 at 12:06 pm

  • Copy link

  Perfect thank you so much! It looks great!