Images on mobile devices

Support
#1

I am finishing up a website using the X theme: http://akronsocietyofartists.com/NEWSite
I just looked at it on a mobile device and the photos on the blog (http://akronsocietyofartists.com/NEWSite/news/) are getting cut in half. Is there any way to get them to resize on a phone?

#2

Hi,

Thanks for writing in!

I can see you have added a fixed width to your featured image using this code,

.entry-featured {
    position: relative;
    margin-top: 3%;
    /* border: 1px solid #dfdfdf; */
    /* border: 1px solid rgba(0,0,0,0.075); */
    margin-left: 0px;
    width: 500px;
    float: center;
    background-color: #fff;
}

By setting it to 500px, the image will stay 500 regardless if you view it in mobile or desktop.

To fix it, you can add this in Custom CSS

@media (max-width:767px) {
     .entry-featured {
          width:100% !important;
     }
}

Hope that helps.