Резиновый блок

[Sayitright]

Здравствуйте. Я затрудняюсь на создании резинового блока. дело в том, что я делаю два резиновых блока, присоединённых друг за другом. если в файле стилей я прописываю 50% на каждый, то при смене разрешения они искривляются и искажаются, в зависимости от количества слов в тексте в них.

Если у кого есть опыт, скажите, как сделать два резиновых блока. высоту можно сделать фиксированной 200px.

<div>Блок 1</div<div>Блок 2</div

Edited April 30, 2010 by Sayitright

[stars]

overflow вам поможет )) ===> http://www.htmlbook.ru/css/overflow.html

[Searcher]

покажите css

[Sayitright]

<div class="n1">Б1</div>

<div class="n2">Б2</div>

.n1 {

display:inline-block;

border:1px solid black;

width:49%;

}

.n2 {

display:inline-block;

border:1px solid black;

width:49%;

}

При разных разрешениях, блок съезжает на другую строку

Edited April 30, 2010 by Sayitright

[stars]

Например так

<div class="n0">
<div class="n1">Б1</div>
<div class="n2">Б2</div>
</div>

.n0 {
width:100%;
height: 200px;
overflow: hidden;

}
.n1 {
width:50%;
height: 200px;
overflow: hidden;
float: left;
}

.n2 {
width:50%;
height: 200px;
overflow: hidden;
float: left;
}

Edited April 30, 2010 by stars

[Sayitright]

Благодарю. Ваш вариант превосходно работает.

Я его под свои нужды настроил, и снова косяк - при смене разрешения на меньшее, правый блок съезжает вниз.

.n1 {

width:47%;

overflow: hidden;

float: left;

border:1px solid black;

margin-bottom:10px;

padding:5px;

padding:5px 1% 5px 1.25%;

}

.n2 {

width:47%;

overflow: hidden;

float: left;

border:1px solid black;

margin-bottom:10px;

margin-left:1%;

padding:5px 1% 5px 1.25%;

}

Edited April 30, 2010 by Sayitright

[Sayitright]

Так, с поразмыслив, понял, что рамка создаёт искажение. Но без неё, стиль получается поганенький.