Title: Responsive image breaking on mobile
Last modified: September 1, 2016

---

# Responsive image breaking on mobile

 *  [atenn](https://wordpress.org/support/users/atenn/)
 * (@atenn)
 * [9 years, 9 months ago](https://wordpress.org/support/topic/responsive-image-breaking-on-mobile/)
 * My new WordPress site is showing a broken header image when viewed on a phone.
   Here’s a screenshot:
 * [http://www.chicagoprogress.com/wp-content/uploads/2016/07/chiprog-error-1.jpg](http://www.chicagoprogress.com/wp-content/uploads/2016/07/chiprog-error-1.jpg)
 * What is the best way to get around this?
 * Ideally I would like to have it change to a different image below a certain breakpoint(
   say, max width 600px) – one with the logo/tagline at full width to ensure they’re
   readable.
 * I’m assuming I’d have to change something here but after much trial and error
   with sizes I can’t get it right for all screen sizes…
 *     ```
       <div id="headimg" class="header-image">
   
       		<a href="http://www.chicagoprogress.com/">
       			<img src="http://www.chicagoprogress.com/wp-content/uploads/2016/07/chiprog-logo-header.png" srcset="http://www.chicagoprogress.com/wp-content/uploads/2016/07/chiprog-logo-header.png 1920w, http://www.chicagoprogress.com/wp-content/uploads/2016/07/chiprog-logo-header-300x52.png 300w, http://www.chicagoprogress.com/wp-content/uploads/2016/07/chiprog-logo-header-768x132.png 768w, http://www.chicagoprogress.com/wp-content/uploads/2016/07/chiprog-logo-header-1024x176.png 1024w" width="1920" height="330" alt="Chicago Progress">
                   </a>
   
       		</div>
       ```
   

The topic ‘Responsive image breaking on mobile’ is closed to new replies.

## Tags

 * [image](https://wordpress.org/support/topic-tag/image/)
 * [mobile](https://wordpress.org/support/topic-tag/mobile/)
 * [srcset](https://wordpress.org/support/topic-tag/srcset/)

 * 0 replies
 * 1 participant
 * Last reply from: [atenn](https://wordpress.org/support/users/atenn/)
 * Last activity: [9 years, 9 months ago](https://wordpress.org/support/topic/responsive-image-breaking-on-mobile/)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics