تقسیم صفحه به دو قسمت تا پایین صفحه
سلام میخام صفحه رو به دو قسمت کامل تقسیم کنم با استفاده از بوت استرپ تونستم، اما میخام کل صفحه (یعنی تمام قد - height full ) اینگونه بشه، لطفا راهنمایی کنید ؟
<div class="row">
<div class="col text-center p-5" style="height:100% !important;">
1
</div>
<div class="col text-center p-5" style="background-color:434bdf;height:100% !important;">
2
</div>
</div>گزینش سوالات
گفت و گو های مرتبط
دسته بندی سوالات
تگ‌های محبوب
ثبت پرسش جدید
![user-avatar]()
داود خانی
تخصص :
برنامه نویس لاراول و متخصص سئو...
@davoodkhany
4 سال پیش
مطرح شد
برنامه نویس لاراول و متخصص سئو
گزارش تخلف
کپی کردن
1
سلام ببین این بدردت می خوره بدون بوت استرپ با استفاده از flex پیاده شده .
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div class="container" style="display: flex; width: 100%;">
<div class="col" style="background: red; width: 50%;height: 100%;">
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Vel accusamus aperiam voluptates? Iste laudantium pariatur vero nihil temporibus similique maxime nesciunt cupiditate ipsum accusamus sint sunt aperiam blanditiis, repellendus ea!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Et vero dignissimos similique laboriosam doloremque, blanditiis, consequatur quo alias sint facere necessitatibus rem tempore consectetur non, illum impedit iste! Nemo, exercitationem.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illo eaque temporibus, quaerat nihil nam dicta sunt enim nulla laborum, ipsam cumque quam odio fugit aut amet incidunt! Dignissimos, animi possimus.
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quaerat, sapiente reiciendis? Officia sed recusandae enim saepe reprehenderit vitae iure est officiis dicta quia. Quidem dolorum minus quas, deleniti quod reprehenderit!
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Quibusdam dolores quia natus quam nesciunt provident iste eaque dolorem harum neque! Recusandae labore architecto animi rerum fugiat asperiores quisquam ea exercitationem.
</div>
<div class="col" style="background: green;width: 50%;height: 100%;">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem dolor ipsa sequi tempore quisquam error labore velit exercitationem incidunt quaerat itaque, nisi, consequuntur sed quae, aut vitae recusandae a modi?
Lorem ipsum dolor sit amet consectetur adipisicing elit. Adipisci voluptas delectus, natus facilis ipsa obcaecati culpa alias! Consequatur, officiis eum iure asperiores, numquam commodi pariatur ut eveniet quidem, magni atque.
</div>
</div>
</body>
</html>