• The twentyeleven theme lacked CSS code for responsive left and right aligned images. I believe I have corrected this by adding the following code to my child theme CSS:

    /* Format Images */
    
    .wp-caption.alignleft {
    		float:none;
    	}
    
    .wp-caption.alignright {
    		float:none;
    	}
    
    img.alignleft {
    		float:none;
    	}
    
    img.alignright {
    	float:none;
    	margin: 0 0 12px;
    	margin: 0 0 0.857142857rem;
    	display:block;
    	}
    
    p.wp-caption-text {
    	margin: 0 0 12px;
    	margin: 0 0 0.857142857rem;
    }
    
    @media screen and (min-width: 600px) { 
    
    	.wp-caption.alignleft {
    		float:left;
    	}
    	.wp-caption.alignright {
    		float:right;
    		margin-left:16px;
    	}
    
    	img.alignleft {
    		float:left;
    	}
    	img.alignright {
    		float:right;
    		margin-left:16px;
    
    	}
    }

    Let me know if you find additional modifications that need to be made.

    Another image issue is the lack of an attachment.php file. Copy the single.php template to your child them. Rename it attachment.php. Then your attached images will open in your theme instead of a blank screen.

Viewing 1 replies (of 1 total)
Viewing 1 replies (of 1 total)
  • The topic ‘Responsive left and right-aligned images.’ is closed to new replies.