javascript - 文字换行时如何在图片下方保留填充

.blogimgarea
{
width: 38%;
padding-right: 26px;
float:left;
}
img{max-width:100%}
.blogtextarea
{
	width:55%;
	padding:22px 32px 0 0;
	float:right;
}

<div class="newpostregion pt70">
	<div class="blogimgarea">
		<img class="featblogimg" src="https://upload.wikimedia.org/wikipedia/commons/5/54/Keeptidy_ask.png" title="In The News">
	</div>
	<div class="blogtextarea">
		<div class="titlelineblog">In The News</div>
		<div class="metalineblog">
			By sitemanager  |  Friday, Feb 12, 2016  |  0 Comments
		</div>
		<div class="contentblog">
		<div class="domore">
			<h2>Our Plastic Surgeon In the News</h2>
			 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et viverra nisl. Nullam lorem tellus, eleifend eu dolor ut, consectetur venenatis velit. Mauris vestibulum sapien ac neque rutrum aliquam. Curabitur diam eros, luctus ac mattis eu, lacinia in turpis. Etiam sed commodo risus. Phasellus odio augue, mollis vel risus nec, vulputate maximus tellus. Duis accumsan, neque at egestas vestibulum, nisi sem ornare tortor, nec consequat lacus sem vitae lectus. Cras ac nibh et velit porttitor placerat eget nec mauris. Vivamus ut lacus non lorem volutpat euismod sit amet ac neque. Pellentesque imperdiet semper ligula, ac pharetra est pretium at. Quisque et venenatis ligula, in eleifend mi.

			Vivamus placerat metus a neque placerat, tincidunt tincidunt magna lacinia. Morbi eget orci arcu. Suspendisse tristique nibh velit, non volutpat dui aliquet at. Cras lacinia nibh sed leo viverra condimentum. In et quam mattis, eleifend ipsum nec, facilisis felis. Vivamus suscipit arcu ut magna laoreet convallis. Morbi suscipit semper magna in dignissim. Vivamus cursus erat sed nulla dictum malesuada at eget ex. Curabitur cursus tincidunt nisl. Praesent in viverra nibh. Donec congue est nulla, nec interdum purus ullamcorper quis.
		</div>
		</div>

	</div>
	<div class="clear"></div>
</div>
	

我正在尝试解析如下的html结构：

http://puu.sh/n5lSB/13745d19f0.png

我精通html和jquery，但是我无法弄清楚如何在图像的左下角留下这样的空白：

http://puu.sh/n5lQ3/f4547056d2.png

我可以轻松地执行更少/更多的基于JavaScript的代码，但无法想到在图像下方留出空白的方法。任何有针对性的建议都将非常有帮助，因为我花了很多时间，但徒劳无益，因为它看起来更容易，但有点挑战。

最佳答案

如果图像是float:left，并且在段落之前，则可以在该段落中添加填充或边距，图像只会将文本进一步推入。

img {
  float: left;
  padding-right: 10px;
}
img+p {
  padding-left: 50px;
}

jsfiddle

如果图像是浮动的并且在段落内，则需要为其分配负的页边距：

.indent {
  padding-left: 50px;
}
.indent img {
  float: left;
  margin-left: -50px;
  padding-right: 10px;
}

jsfiddle