Topic Progress:

Float is a property that is used to align different objects on your webpage. When Float is added in CSS to an image, it causes the text below to be moved up onto the same line as the image and wrap around it. It also allows you to define which side of the webpage you want your image to be on compared to the text. The main values that are used for float is right and left.

Float: right = shifts the object to the right side of the webpage

Float: left = shifts the object to the left side of the webpage (In this example, padding of 10px has been added to the image so the text does not sit hard against the edge of the image)

Now have a go yourself! Try shifting this image to the right side of the page using float

Watch this video to go over the float and clear (covered on the next page) properties!


Not recently active