Snippets

Snippet: Full Width Aligned Images on Mobile

  • Updated:

The following CSS will make any images set to left/right align full width on mobile. This will apply to the entire site so make sure to only use it if you really want to force all images to 100% on mobile. Now, this will not actually stretch the images to 100% but it will remove the float so the container that is holding the image doesn't float thus any text that was wrapping around on desktop will instead go below/above the image.

@media only screen and (max-width: 767px) {
	
	img.alignright,
	img.alignleft {
		float: none;
		margin: 0 0 20px;
		width: 100%;
	}

}
All PHP snippets should be added via child theme's functions.php file or via a plugin. We recommend Code Snippets (100% Free) or WPCode (sponsored)
Back To Top