Кроссплатформенный открытый движок на Java, позволяющий создавать 2D и 3D игры под различные платформы, среди которых: Android, HTML5, Windows, Linux, iOS.
Поддержи проект!
Рекомендуем
Блог разработчика
Главная » 2013 » Июнь » 18 » Блоки DIV в колонках одинаковой высоты, с использованием CSS.
11:45 AM
Блоки DIV в колонках одинаковой высоты, с использованием CSS.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html>
<head>
<title>
Блоки DIV в колонках одинаковой высоты с использованием CSS
</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
#container { overflow: hidden; }
#container div { float: left; background: #ccc; width: 45%; margin-bottom: -20000px; padding-bottom: 20000px; padding-left:30px }
#container .col2 { background: #eee; }
</style>
</head>
<body>
<h1>
DIV колонки одинаковой высоты
</h1>
<div id="container">
<div>
<p align="justify">
Столбцы одинаковой высоты при помощи CSS. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec ac lectus ac ligula cursus ullamcorper. Aliquam iaculis nonummy libero. Nulla nisi
libero, faucibus quis, egestas non, congue vel, dolor. Nulla facilisi. Quisque non metus malesuada libero suscipit cursus. Nam eget metus. Aliquam non quam. Integer sit amet pede eu est
gravida fermentum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed vulputate tempus felis. Vestibulum tincidunt elit sit amet est. Sed
ultricies tempus enim. Curabitur quam augue, fringilla ac, imperdiet et, dignissim sit amet, erat. Aenean ornare. Quisque turpis neque, suscipit pretium, aliquet sed, eleifend vitae, elit.
Ut velit neque, venenatis non, convallis at, nonummy tincidunt, nisl. Morbi sapien.
</p>
</div>
<div class="col2">
<p align="justify">
Решение проблемы - DIV одинаковые по высоте. Praesent mauris. Proin arcu. Maecenas elementum. Curabitur congue, ante ut pretium suscipit, lectus elit porttitor arcu, ac porta magna ante sit
amet nulla. Suspendisse sed tellus. In eget mi in risus adipiscing lobortis. Nam lobortis ipsum quis nibh. Donec odio. Nullam fermentum, leo id condimentum viverra, augue nibh viverra dui,
in placerat arcu sapien nec velit. Nunc tincidunt molestie elit. Sed est mi, posuere vitae, congue vitae, pulvinar vel, enim. Morbi vestibulum erat sed risus. Nulla facilisi.
</p>
<p>
Integer nec neque. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent dictum venenatis velit. Morbi interdum eleifend sapien. Morbi a mauris. Nulla auctor varius elit.
Mauris id nibh ac orci egestas gravida. Nam orci. Fusce dui. Nulla interdum pharetra mauris. Sed fermentum purus ac lectus. Vivamus et dui ac quam vehicula tristique. Cras sem. Integer non
nisi commodo elit sagittis interdum.
</p>
</div>
</div>
</body>
</html>