需要div扩展以包含甚至大于页面宽度的内容

Question

I need to have a div stretch to contain the content when the content is larger than the div, even when the content stretches beyond the width of the html page. 当内容大于div时，即使内容超出html页面的宽度，我也需要进行div拉伸以包含内容。

Example HTML: HTML示例：

<body>
    <div id="outerDiv">
        <div id="innerDiv">asdfasdfkjasdflkjasldkfalsdkfjalsdkflaskdjfaslkdjfkalsjdhfkasjdhkljsdfashdjsdkjasfkjakfjhskdjfhakjdhkasjdhfsjdkashasjhkajsdkashkashfkajsdlfkjaskdjfhaksdjlaskjdkjdfhkasjdkajndckasjdbcjhsadcjkhasbdfhasbfjkasbdkjfnasdkcsdjfnaksjdfbaksdhfiweuhfjskdbfasjdfnasdfasdfasf
        </div>
    </div>
</body>

Example CSS: CSS示例：

#outerDiv
{
    background-color: red;
}

#innerDiv
{
    background-color: blue;
}

I have an example here: http://jsfiddle.net/978ew1jz/4/ 我在这里有一个例子： http : //jsfiddle.net/978ew1jz/4/

I want the blue div to stretch as long as the text does. 我希望蓝色div能够与文本一样长。

Edit: I also need the red div to still surround the blue div when the blue div stretches. 编辑：当蓝色div伸展时，我还需要红色div仍然围绕蓝色div。

Answer 1

Change your #outerDiv CSS to 将您的#outerDiv CSS更改为

#outerDiv
{
  background-color: red;
  display:inline-block;
  width: auto;
}

and it will stretch as per the content. 它将根据内容进行拉伸。

EDIT: 编辑：

Here is the Fiddle . 这是小提琴。 Your red div will stretch with the blue div . 您的red div将与blue div一起延伸。

需要div扩展以包含甚至大于页面宽度的内容

问题描述

1 个解决方案

解决方案1
2 已采纳 2015-05-06 04:41:54

需要div扩展以包含甚至大于页面宽度的内容

问题描述

1 个解决方案

解决方案1 2 已采纳 2015-05-06 04:41:54

解决方案1
2 已采纳 2015-05-06 04:41:54