Elements after the floating elements will flow around it. To avoid this, use the clear property. The clear property specifies sides of an element other floating elements are not allowed. Add a text line into the image gallery, using the clear property.
Elements are floated horizontally; this means that an element can only be floated left or right, not up or down. A floated element will move as far to the left or right as it can. Usually this means all the way to the left or right of the containing element. The elements after the floating element will flow around it. The elements before the floating element will not be affected. If an image is floated to the right, a following text flows around it, to the left:
Example:
Img
{
Float:right;
}
Floating Elements Next to each other
If you place several floating elements after each other, they will float next to each other if there is room. Here we have made an image gallery using the float property.
Hiding an element can be done by setting the display property to “none” or the visibility property to hidden. However, notice that these two methods produce different results. Visibility: hidden hides an element, but it will still take up the same space as before. The element will be hidden, but still affect the layout.
Example:
h 1.hidden{visibility: hidden;}
display: none hides an element, and it will not take up any space. The element will be hidden, and the page will be displayed as the element is not there.
