html - テキストを div で囲む

Question

div 2 を div 1 にラップするにはどうすればよいですか?

(両方の div にテキストが含まれます)

+---++------------------+
|   ||                  |
| 1 ||                  |
|   ||          2       |
+---+|                  |
+----                   |
|                       |
+-----------------------

Answer 1

Float div 1:デモ

CSS:

#d1 {
  float: left;
}

HTML:

<div id="d1">Hello world. Hello world. Hello world. </div>
<div id="d2">
  Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing.
</div>

Answer 2

div をネストし、左にフロートさせ、内側の div にディメンション スタイルを適用します。ここにデモンストレーションがあります: http://jsfiddle.net/njmWS/ :

HTML:

<div>
    <div>
        <div>
            Hello
        </div>
        My name is abraham lincoln
    </div>
    And I hunt vampires
</div>

CSS:

div{
    float:left;
    background-color:gray;
    color:white;
    height:200px;
    width:300px;
}
div > div{
    background-color:blue;
    height:100px;
    width:50%;
}
div > div > div{
    background-color:red;
    height:50px;
    width:70%;
}

Answer 3

CSSですよね？div を重ねてみて、何ができるか見てみましょう。チャートから div 2 を div 1 に変更して、それがより大きなスペースになり、他の div がその中に収まるようにします。