float и border

[goodbenya]

Добрый день. Вот есть вопрос хочу разместить два слоя рядом которые делят контейнер на половину. Ну если добавляю еще рамки к слоям то получается нето что я хочу(смещение по вертикали). Как я понял это из за border. Как можно это исправить?

ССS

#conteyner

{

width:80%;

}

#main1

{

float:left;

width:50%;

border:1px Solid red;

}

#main2

{

float:left;

width:50%;

border:1px Solid red;

}

HTML

<div id="conteyner">

<div id="main1">1</div>

<div id="main2">2</div>

</div>

Как реализовать?Понимаю что рамка нарушает отношение 50 на 50 из за этого и ошибка.

[gritsyuk]

Как вариант box-sizing: border-box; для #main1, #main2.

Edited August 16, 2012 by gritsyuk

[rus]

плюс второй вариант - отрицательный маржин для блока #main2: margin-right: -50%;

[goodbenya]

Спасибо большое.... box-sizing: border-box это то что я хотел; Второй вариант мне кажется велосипед, ну спасибо все равно.