{"id":228,"date":"2021-06-07T12:55:55","date_gmt":"2021-06-07T11:55:55","guid":{"rendered":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/?page_id=228"},"modified":"2021-06-10T12:19:06","modified_gmt":"2021-06-10T11:19:06","slug":"float-and-clear","status":"publish","type":"page","link":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/css\/css-properties\/float-and-clear\/","title":{"rendered":"float and clear"},"content":{"rendered":"

\"\"\"\"<\/a>Float<\/h1>\n

The float property moves an element to the left or right of the container.<\/p>\n

On this page, the w3schools and Higher logos have been floated to the right.<\/p>\n

Display element on the left:<\/p>\n

\r\n.sideimage {\r\n    float: left;\r\n}\r\n<\/pre>\n
Display element on the right:<\/p>\n
\r\n.sideimage {\r\n    float: right;\r\n} <\/pre>\n
Floating Multiple Elements<\/h2>\n
Floating several elements one after another will result in the elements being display beside<\/strong> each other.<\/p>\n
This can be seen at the top of the page where the w3schools and Higher logo are beside each other.<\/p>\n
 <\/p>\n
\"\"<\/a>Clear<\/h1>\n
After floating elements, it may be necessary to move to a blank line below them before displaying further elements.<\/p>\n
\r\n.startunderneath {\r\n    clear: both;\r\n}\r\n<\/pre>\n
 <\/p>\n
 <\/p>\n","protected":false},"excerpt":{"rendered":"
Float The float property moves an element to the left or right of the container. On this page, the w3schools and Higher logos have been floated to the right. Display element on the left: .sideimage { float: left; } Display element on the right: .sideimage { float: right; } Floating Multiple Elements Floating several elements one after another will result in the elements being display beside each other. This can<\/p>\n
Read More<\/a><\/p>\n","protected":false},"author":7,"featured_media":0,"parent":366,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-228","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/pages\/228","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/comments?post=228"}],"version-history":[{"count":6,"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/pages\/228\/revisions"}],"predecessor-version":[{"id":379,"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/pages\/228\/revisions\/379"}],"up":[{"embeddable":true,"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/pages\/366"}],"wp:attachment":[{"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/media?parent=228"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}