User 13204940 Ответов: 0

Два бок о бок дива


Привет,

I'm looking to create a page where the left and right divs both fit the width and height of their content, while not 'collapsing' the height of the parent div. With the following code, it looks visually correct but the parent div has a height of 0 and that shouldn't be the case - it could cause issues down the line. The page needs to be completely dynamic, meaning there could be any amount of content in both divs, meaning their heights need to dynamically fit the contents. There could also be images of varying sizes in the right div, so it needs a dynamic width depending on the content. The left div will just fill the rest of the space in that case.

Важно, чтобы левый div действительно заполнял оставшееся пространство, так как он может иметь цвет фона, который будет заметно коротким, если нет.

<div id='page_contents'>
	<div id='page_left'>
		<p>
			This is a <a href='paragraph'>paragraph</a>.
		</p>				
		<p>
			This is another paragraph.
		</p>
	</div>
	<div id='page_right'>
		something here
	</div>
</div>
#page_contents
{
	position: relative;
}

#page_left
{
	float: left;
	color: rgb(43, 43, 43);
	width: 85%;
	margin: 0 16px 0 0;
}

#page_right
{
	width: 15%;
	height: 1000px;
	border: 1px solid black;
	position: absolute;
	right: 0;
}


Что я уже пробовал:

-----------------------------------------------------------------------

Herman&lt;T&gt;.Instance

#page_right
{
/* добавлять */
поплавок: правый;
}

[no name]

Я в замешательстве относительно 1-звездочного голосования, как будто я действительно забочусь о репутации на этом сайте, но ладно.

Мне удалось решить этот вопрос и еще один с помощью display: table-cell

0 Ответов