• Resolved steveredshaw

    (@steveredshaw)


    I am using a theme from this excellent web template resource https://andreasviklund.com/.

    When I insert a photo into a post using the editor the alignment html tag appears as class=”alignleft size-medium wp-image-197″

    However this does no allow the paragraph to sit alongside the photo. The text starts at the bottom of the image.

    I have found I need to change the tag to align=”left” align=”right” hspace=”15″.

    This seems to be peculiar to the theme I am using, it doesn’t happen on the default theme.

    I know that the align and hspace tags are now deprecated and I’m not sure using align twice in an html string is good practice. Can anyone advise me on this or add a useful comment please?

    Thanks

Viewing 2 replies - 1 through 2 (of 2 total)
  • HasanulBanna

    (@hasanulbanna)

    Hi stever,
    its seems like you don’t have default class of image alignment on your theme.

    Please try to add these at CSS and try

    /* Begin Images */
    p img {
    	padding: 0;
    	max-width: 100%;
    	}
    
    /*	Using 'class="alignright"' on an image will (who would've
    	thought?!) align the image to the right. And using 'class="centered',
    	will of course center the image. This is much better than using
    	align="center", being much more futureproof (and valid) */
    
    img.centered {
    	display: block;
    	margin-left: auto;
    	margin-right: auto;
    	}
    
    img.alignright {
    	padding: 4px;
    	margin: 0 0 2px 7px;
    	display: inline;
    	}
    
    img.alignleft {
    	padding: 4px;
    	margin: 0 7px 2px 0;
    	display: inline;
    	}
    
    .alignright {
    	float: right;
    	}
    
    .alignleft {
    	float: left;
    	}
    /* End Images */
    
    /* Captions */
    .aligncenter,
    div.aligncenter {
    	display: block;
    	margin-left: auto;
    	margin-right: auto;
    }
    
    .wp-caption {
    	border: 1px solid #ddd;
    	text-align: center;
    	background-color: #f3f3f3;
    	padding-top: 4px;
    	margin: 10px;
    	-moz-border-radius: 3px;
    	-khtml-border-radius: 3px;
    	-webkit-border-radius: 3px;
    	border-radius: 3px;
    }
    
    .wp-caption img {
    	margin: 0;
    	padding: 0;
    	border: 0 none;
    }
    
    .wp-caption p.wp-caption-text {
    	font-size: 11px;
    	line-height: 17px;
    	padding: 0 4px 5px;
    	margin: 0;
    }
    /* End captions */
    Thread Starter steveredshaw

    (@steveredshaw)

    thanks so much, that fixed the problem, my images are behaving themselves now

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘correct html commands’ is closed to new replies.