jackmyers.info

Clearing Float

Note how paragraph 2 will never float left, it always starts on the far left. Compare this to the right.

There are lots of different kinds of fruit - there are over 500 varieties of banana alone. By the time we add the countless types of apples, oranges, and other well-known fruit, we are faced with thousands of choices.

One of the most interesting aspects of fruit is the variety available in each country. London is an area which is known for its apples. As is Wisconsin.

When travelling in Asia, I was struck by how many different kinds of banana were available - many of which had unique flavours and which were only avaiable within a small region.

STYLE

            p.toggle {
                float:left;
                border: medium double black;
                width: 40%;
                margin: 2px;
                padding: 2px;
            }
            
            p.cleared {
                clear:left;
            }
            
        <p class="toggle">
            There are lots of different kinds of fruit - there are over 500 varieties
            of banana alone. By the time we add the countless types of apples, oranges,
            and other well-known fruit, we are faced with thousands of choices. 
        </p>
        <p class="toggle cleared">
            One of the most interesting aspects of fruit is the variety available in
            each country. London is an area which is known for its apples. As is
            Wisconsin. 
        </p>
        <p>
            When travelling in Asia, I was struck by how many different
            kinds of banana were available - many of which had unique flavours and
            which were only avaiable within a small region.
        </p>