{"id":67526,"date":"2011-12-26T08:00:40","date_gmt":"2011-12-26T13:00:40","guid":{"rendered":"http:\/\/wpmu.org\/?p=67526"},"modified":"2012-11-20T15:00:25","modified_gmt":"2012-11-20T20:00:25","slug":"daily-tip-how-to-keep-images-from-running-into-your-wordpress-content","status":"publish","type":"post","link":"https:\/\/wpmudev.com\/blog\/daily-tip-how-to-keep-images-from-running-into-your-wordpress-content\/","title":{"rendered":"How to Keep Images from Running into Your WordPress Content"},"content":{"rendered":"

Everyone seems to have issues with the WordPress editor at one time or another. It seems to have a mind of its own and will do things to your content that you don\u2019t want done.<\/p>\n

One issue that seems to occur occasionally is when your text content creeps up around an image even when you tell it not to. No matter what you do, you can\u2019t get the image to simply sit above the text and be separate from it.<\/p>\n

 <\/p>\n

\"Post<\/a><\/p>\n

The Solution<\/strong><\/h2>\n

Here\u2019s a solution that should solve your problem.<\/p>\n

Go into the HTML view on your editor, and then wrap the image in div tags with some styling that says clear:both;<\/em>.<\/p>\n

<div style=clear:both;>(your image)<\/div><\/code><\/p>\n

Or set out more clearly \u2026<\/p>\n

<div style=clear:both;><\/code>
\n(Your image info.)<\/code>
\n<\/div><\/code><\/p>\n

Here\u2019s an example:<\/p>\n

<div style=clear:both;><a href=\"http:\/\/example.com\/wp-content\/uploads\/musicman.jpg\"><img class=\"alignnone size-full wp-image-375\" title=\"musicman\" src=\"https:\/\/example.com\/wp-content\/uploads\/musicman.jpg\" alt=\"\" width=\"125\" height=\"125\" \/><\/a><\/div><\/code><\/code><\/p>\n

 <\/p>\n

\"Post<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

A little CSS trick you can use when the WordPress editor won\u2019t behave.<\/p>\n","protected":false},"author":84404,"featured_media":207254,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"blog_reading_time":"","wds_primary_category":0,"wds_primary_tutorials_categories":0,"footnotes":""},"categories":[263],"tags":[1044,16,2186],"tutorials_categories":[],"class_list":["post-67526","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorials","tag-css","tag-images","tag-wordpress-editor"],"_links":{"self":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/67526","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/users\/84404"}],"replies":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/comments?post=67526"}],"version-history":[{"count":1,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/67526\/revisions"}],"predecessor-version":[{"id":206844,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/67526\/revisions\/206844"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media\/207254"}],"wp:attachment":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media?parent=67526"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/categories?post=67526"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tags?post=67526"},{"taxonomy":"tutorials_categories","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tutorials_categories?post=67526"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}