DIV, проблема с width

[TavlaD]

Помогите, пожалуйста, разобраться. Недавно только начал верстать слоями и практики в этом мало. Пытаюсь сверстать следующий макет:

Ну это примерно какие блоки будут и где примерно они должны находиться. По ходу верстки столкнулся со следующей проблемой.

Сайт будет растягиваться по ширине окна браузра. box-r - не изменяется и имеет фиксированную ширину, box-l - растягивается. Так вот надо чтобы слои button располагались по центру внутри слоя box-l и растягивались в зависимости от ширины. Кроме этого когда всталяешь таблицу в box-l либо в box-cont (тоже растягивается) и width таблицы ставишь 100% то в IE таблица вылазит и принимает значение 100% от всего экрана, а не того слоя в котором находится. Где у меня ошибка или как можно это подправить

Вот код страницы

<div class="whitephon"> 
  <div class="bg-top"> </div>
  <div class="line-top"></div>
  <div class="box-r">ссылки<br>ссылки<br>ссылки<br>ссылки<br>ссылки<br>ссылки<br>ссылки<br>ссылки<br>ссылки<br>ссылки<br>ссылки</div>
  <div class="box-l">
	<div class="button"><img name="img1" src="" width="200" height="46" alt=""></div>
	<div class="button"><img name="img2" src="" width="200" height="46" alt=""></div>
	<div class="vip-ob"></div>
	<div class="box-news">text</div>
	<div class="box-cont">content</div>
  </div>
  <div class="clear"></div>
</div>

А это CSS

body {
	background-color: #EEEEEE;
	margin: 0px;
	padding: 0px;
}
.whitephon {
	background-color: #FFFFFF;
	margin-top: 10px;
	margin-right: 10px;
	margin-bottom: 15px;
	margin-left: 10px;
}
.bg-top, .line-top {
	margin-right: 3px;
	margin-left: 3px;
}
.bg-top {
	background-image: url(images/bg-top.jpg);
	top: 3px;
	position: relative;
	height: 164px;
}
.line-top {
	background-color: #80C9FF;
	height: 10px;
	font-size: 1px;
}
.box-l {
	background-color: #FFFFCC;
	margin-right: 220px;
	margin-top: 10px;
	margin-left: 5px;
}
.box-r {
	background-color: #F5F5F5;
	width: 200px;
	border-right-width: 2px;
	border-right-style: solid;
	border-right-color: #FCBE00;
	padding: 0;
	margin-top: 15px;
	margin-right: 3px;
	margin-bottom: 10px;
	float: right;
}
.clear {
	clear: both;
}
.button {
	background-image: url(images/bg-button.jpg);
	background-repeat: repeat-x;
	float: left;
	height: 50px;
	margin-right: 4px;
	margin-left: 4px;
	border: 1px solid #000000;
	text-align: center;
	[color="#FF0000"]width: 48%;[/color]
	z-index: 2;
	position: relative;
}
.button img {
	margin-top: 3px;
}
.vip-ob {
	background-color: #00FFFF;
	height: 150px;
	margin-right: 3px;
	margin-left: 3px;
	clear: left;

}
.box-news {
	float: left;
	width: 240px;
	background-color: #99FF33;

}
.box-cont {
	background-color: #0000FF;
}

[psywalker]

попробуй так прописать, у меня получилось всё

.box-cont {

background-color: #0000FF;

overflow: hidden;

zoom: 1;

}

но это при раскладах, если я засовывал таблицу в .box-cont , тоесть она у меня не выходила за кроя, это точно нигде, даже в ИЕ6

[TavlaD]

Все получилось, большое спасибо

[psywalker]

забудь