Jak zrobić zawijanie tekstu wokół obrazka w HTML i CSS.

pytanie zadane 21 września 2019 w Rozwój zawodowy, nauka, praca przez Kubs Mądrala (5,190 p.)

Witajcie,

jak zrobić zawijanie tekstu wg. wzoru poniżej? Chcę użyć html i css.

2 odpowiedzi

odpowiedź 21 września 2019 przez Patrycjerz Mędrzec (192,320 p.)

Zainteresuj się właściwością float –https://developer.mozilla.org/pl/docs/Web/CSS/float.

komentarz 22 września 2019 przez Kubs Mądrala (5,190 p.)

Dziękuję. Rzeczywiście ładnie działa.

odpowiedź 21 września 2019 przez Krzysztof Korpas Obywatel (1,560 p.)

Witam, skleciłem coś takiego na szybko powinno objaśnić zasadę. jak coś pytaj.

<!DOCTYPE html>

<html>

    <head>

        <style>

            body{

                margin: 0;

                padding: 0;

 

            }

            #main{

            

                display: block;

                width: 1000px;

                margin: 0 auto;

            }

            .image{

                

                display: block;

                float: left;

                height: 80px;

                width: 100px;

                

            }

            img{

                height: 80px;

                width: 100px;

                

            }

            .text{

                

                float: left;

                width: 600;

                

            }

        </style>

    </head>

    <body>

        <div id="main">

            <article>

               <div class="image"> <img src="img.png"></div>

                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla in maximus ante, eget placerat felis. Integer vitae augue ac nisl facilisis molestie sit amet non odio. Integer sodales vestibulum leo, ac faucibus leo egestas quis. Praesent ultricies rhoncus risus at aliquam. Sed dictum malesuada dui, id vehicula ligula pulvinar ac. Donec tristique magna id libero ultricies interdum. Vestibulum commodo erat vel nisi pretium porttitor. Vestibulum sit amet dui vel justo feugiat dignissim. Mauris condimentum convallis velit, quis commodo risus consectetur sed. Maecenas volutpat libero et vehicula rutrum. Donec est libero, semper vitae sollicitudin eu, volutpat sit amet ligula. Donec placerat viverra augue, id convallis est ullamcorper sit amet. Morbi laoreet commodo sagittis. Duis vitae imperdiet ipsum, at lacinia justo. </p></article>

            </article>

        </div>

    </body>

</html>