<!doctype html>
<html>
    <head>
        <title></title>
        <link rel="stylesheet" href="index.css">
        <link rel="preconnect" href="https://fonts.googleapis.com">
        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
        <link href="https://fonts.googleapis.com/css2?family=Rubik+Doodle+Shadow&display=swap" rel="stylesheet">
    </head>
    <body>
        <img src="flamingoFloat.jpeg" alt="pink flamingo swim ring on body of water in summer">
        <p class="para-1">
            The float property was introduced to allow web developers to implement layouts involving an image floating inside a column of text, with the text wrapping around the left or right of it. The kind of thing you might get in a newspaper layout.
        </p>
        <!-- <p>
            <span class="dropcap">B</span>ut developers quickly realized that you can float <strong>anything</strong>, not just images, so the use of float broadened, for example to fun layout effects such as drop-caps.
        </p> -->
        <!-- <p class="para-3">
        <img src="carnivalFloat.png" alt="A colorful parade float, with flowers and decorations">
            Float can cause issues with really small paragraphs in containers.
        </p> -->
    </body>
</html> 

<!-- Photo credit: https://unsplash.com/photos/pink-flamingo-swim-ring-on-body-of-water-in-summer-m82uh_vamhg -->

<!doctype html>

<html>

<head>

rel="stylesheet">

</head>

<body>

The float property was introduced to allow web developers to implement layouts

involving an image floating inside a column of text, with the text wrapping around the

left or right of it. The kind of thing you might get in a newspaper layout.

<!--

But developers quickly realized that you can float

anything, not just images, so the use of float broadened, for example

to fun layout effects such as drop-caps.

-->

<!--

Float can cause issues with really small paragraphs in containers.

-->

-5:21