مشکل float

    • 1403/02/12 09:51
    سعید ابطحی
    سعید ابطحی
    کاربر
    1

    سلام خوبین

    یه مشکلی،وقتی از float استفاده می کنم تگ بعدی که استفاده می کنم میاد وسط اون تا تگی که براشون float گذاشتم.اگه عرضشون کل صفحه رو بگیره مشکلی پیش نمیاد ولی به محض اینکه عرض رو کم می کنم محتوای اون تگ سوم میاد وسط این دوتا چیکار کنم؟ کدمم می فرستم

       #it1{
            width: 200px;
            height: 300px;
            background-color: red;
           float: left;
        }
        #it2{
            width: 200px;
            height: 300px;
            background-color: yellow;
            float: right;
        }
     
    <div id="it1"></div>
        <div id="it2"></div>
        <div>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Obcaecati tenetur aut ipsam praesentium non, quis ut accusantium, odit soluta, enim nostrum! Incidunt quo doloribus non officiis enim amet at cum?</div>
    • 1403/02/12 11:06
    ایران باینری
    ایران باینری
    استاد
    0

    سلام روزتون بخیر

    به خاطر استفاده از floatاین حالت پیش میاد توی دوره هم گفتم باید از ویژگی clear استفاده کنین. در این حالت یا باید به تگ بعدی که می نویسید یعنی همون تگ div که توش متن نوشتید ویژگی clear با مقدار both بدید.یا اینکه یه کلاس تعریف کنید به اسم clearfix همون ویژگی clear  رو با مقدار both بهش بدید هرجا که توی پروژه تون از float استفاده کردید این کلاس رو استفاده کنید در تگی که بعد از اونها میاد اینجوری کارتون هم راحت تره و حرفه ای تر.

    موفق باشید.