CSS. колонки одинаковой высоты
245 повідомлень
#16 років тому
Салям алейкум =) Как можно сделать 2 колонки одинаковой высоты (без задания height:*px) при условии, что:- position: absolute не используется
- нужно, чтобы именно слои тянулись нужным образом, т.е. без цветовых эффектов.
- высота родительского блока заранее не известна и не 100%
спасибо!
2195 повідомлень
245 повідомлень
#16 років тому
Забыл сказать, что мне концы блоков нужны. У меня блоки закругленные.
2195 повідомлень
#16 років тому
Так закруглите в background, делов-то. Если уж совсем все печально - расставить 4 span уголка с position:absolute
245 повідомлень
#16 років тому
Цитата ("Sir_Michael"):Так закруглите в background, делов-то. Если уж совсем все печально - расставить 4 span уголка с position:absolute
закруглить то как знаю. (больше нравится способ "звезда" и "бордюр"
245 повідомлень
2195 повідомлень
245 повідомлень
#16 років тому
Сделал с помощью margin-bottom:-32767px; padding-bottom:32767px;.Но проблема теперь в том, что я не могу сделать скругленные нижние уголки. Делаю через poition:absolute, bottom:0 pх. А это, сами понимаете, ведет к тому, что уголки не видно (за счет margin и padding)
2195 повідомлень
#16 років тому
Что мешает поместить в колонку еще один div?
245 повідомлень
#16 років тому
Пробовал по разному. Даже если поразмыслить: часть слоя уходит вниз (за счет margin+padding). А overflow:hidden он не отрезает слой, а делает часть его невидимой. вот один из вариантов (НЕ рабочий)
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=7"/>
<title>sample</title>
<style>
#wrapper{
width: 100%;
position: relative;
background: orange;
overflow:hidden;
}
#left, #right{
margin-bottom:-32767px;
padding-bottom:32767px;
}
#left{
margin-right: 50%;
background: yellow;
}
#right{
position:relative;
float: right;
width: 50%;
background: green;
}
#wrap_right{
position: relative;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="right">
<div id="wrap_right">blablablablabnlaballbalba <br> blablablalba
<div style="position: absolute; bottom:0px; left:0px;">bottom</div>
</div>
</div>
<div id="left">
blablablablabnlaballbalba <br> blablablablabnlaballbalba <br>blablablablabnlaballbalbablablablablabnlaballbalba <br>
blablablablabnlaballbalba<br>blablablablabnlaballbalba<br>blablablablabnlaballbalba
</div>
</div>
</body>
</html>
245 повідомлень
#16 років тому
Ауууу, народ, хелп ))
2195 повідомлень
#16 років тому
Уже не знаю как подсказывать - даже несколько примеров привел 
245 повідомлень
#16 років тому
Цитата ("Sir_Michael"):Уже не знаю как подсказывать - даже несколько примеров привел
Вы точно понимаете, о че я имею ввиду!? Мне необходимы 2 колонки с скругленными уголками. В Ваших примерах везде используется overflow:hidden, который не обрезает слой, а скрывает часть его.
Если Вам не сложно, можно подробнее? Пример Выше я привел.
2195 повідомлень
