Проблема с правым блоком

[Bingo]

Здравствуйте, не могу понять в чем дело, при width=100% div с id="container" выходит за рамки поля, и появляется горизонтальная полоса прокрутки, а мне нужно чтобы не выходил за пределы браузера..

<div id="wrapper">


	<div id="left">
	gggg



</div>
<div id="container" >
<div id="content">
<br>
тексттексттексттексттексттексттексттексттексттексттексттекст


</div>	
	</div>

</div>

#wrapper {
	width: 100%;
	margin: 0 auto;


 min-height: 100%;
	height: auto !important;
	height: 100%;

display:table;}


#container {

	float: left;
border:1px solid black;	
width:100%;
padding-left:210px;
overflow: hidden;
position:absolute;

}
#content {
padding: 10px 28px 0 10px;
color:#000000;
font:12px;
font-family:Arial;
text-align:justify;
width:100%;
}

/* Sidebar Left
—————————————————————————--*/

#left
{
float: left;
position:relative;
width: 210px;
background:#ffffff;
background:url(/images/left.jpg) no-repeat;
padding-left:25px;
margin-top:170px;
height:968px;	
}

не поможете?)

Edited December 14, 2011 by Bingo

[Gaspode]

float: left;

border:1px solid black;

width:100%;

padding-left:210px;

overflow: hidden;

position:absolute;

1. Для абсолютно позиционированных элементов float не работает.

2. Общая ширина видимой части элемента = width + ширина паддингов + ширина рамки. В вашем случае, ширина равна 100% + 210 пикселей + 2 пикселя. Отсюда и проблемы, надо полагать.

[Bingo]

насчет ширины, да убрал и все норм, бордер поставил чтобы лучше видно было). А как тогда расположить чтобы от левого блока он отходил?

просто ставлю margin-left ну и он конечно смещается..

Edited December 14, 2011 by Bingo

[Gaspode]

Ну он же абсолютно позиционирован, сдвиньте его через left/right/top/bottom.

Для таких случаев вместо border лучше задавать outline, эта рамка не влияет на ширину, да и вообще не влияет ни на что.

Edited December 14, 2011 by Gaspode

[Bingo]

Спасибо большое! Получилось, сделал так

#container {

float: left;

width:100%;

overflow: hidden;

position:absolute;

}

#content {

padding: 10px 28px 0 210px;

color:#000000;

font:12px;

font-family:Arial;

text-align:justify;

}

а в #content просто paddding сделал слева и все так как нужно встало

Gaspode, Спасибо тебе еще раз!

по поводу outline спасибо, буду теперь так когда проверяю делать)

Edited December 14, 2011 by Bingo