{"id":295,"date":"2011-07-05T19:00:59","date_gmt":"2011-07-05T19:00:59","guid":{"rendered":"http:\/\/www.sitekickr.com\/blog\/?p=295"},"modified":"2011-07-05T19:00:59","modified_gmt":"2011-07-05T19:00:59","slug":"clear-both-content-below-all-floats","status":"publish","type":"post","link":"https:\/\/www.sitekickr.com\/blog\/clear-both-content-below-all-floats\/","title":{"rendered":"Clear both puts content below all floated content"},"content":{"rendered":"

If you have a left-floated navigation bar, and a main content column, you may notice that when "clear: both;" any content within the main content column, it will drop it below the navigation bar.<\/p>\n

There are two solutions:<\/p>\n

    \n
  1. Float your main content div as well. This may require other CSS changes.<\/li>\n
  2. Add "overflow: hidden;" to your content div. See below:<\/li>\n<\/ol>\n

    #column-left { float: left; width: 185px; }
    \n\t#content { margin-left: 200px; overflow: hidden; }
    \n\t<\/code><\/p>\n","protected":false},"excerpt":{"rendered":"

    If you have a left-floated navigation bar, and a main content column, you may notice that when "clear: both;" any content within the main content…<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"amp_status":""},"categories":[77,12],"tags":[90],"_links":{"self":[{"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/posts\/295"}],"collection":[{"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/comments?post=295"}],"version-history":[{"count":1,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/posts\/295\/revisions"}],"predecessor-version":[{"id":297,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/posts\/295\/revisions\/297"}],"wp:attachment":[{"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/media?parent=295"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/categories?post=295"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/tags?post=295"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}