Html Div-won'；t垂直调整大小以适合文本。没有位置：相对的或类似的

我的主体div不会调整大小以适合我的文本

我的设置是一个主体容器div。在该div中有页眉div、主体div和页脚div。在主体div中有3个div，分别称为body left、body middle和body right。这些都是并排使用css样式float:left的

我已尝试设置bodycontainer的高度、bodycontainer的最小高度以及bodycontainer中的div的相同高度

下面是正在发生的事情的屏幕截图：

这是我的html：

<div id="maincontainer">
<div id="headercontainer">
    <a href="/index.html"><div id="header-logo"></div></a>
    <div id="header-navbar">
        <div id="navbar" align="center">
            <a href=""><div>Home</div></a>
            <a href=""><div>Roster</div></a>
            <a href=""><div>FAQ</div></a>
            <a href=""><div>Donate</div></a>
            <a href=""><div>About</div></a>
            <a href=""><div>Contact</div></a>
        </div>
    </div>
</div>
<div id="bodycontainer">
    <div id="body-left">
        <ul>
            <div>
                <a href="http://www.facebook.com/darkonyxftw" title="Click to go to our Facebook page." target="_blank">
                                    <div class="social-odd">
                                    <h3 class="social">Facebook</h3>
                                    <p class="social">All tweets and youtube uploads, as well as updates and notifications go on our facebook. Like our page to get the notifications on your wall.
                                </p>
                                <p class="social">facebook.com/DarkOnyxFTW</p>
                            </div>
                        </a>
                        <a href="http://www.youtube.com/subscription_center?add_user=darkonyxftw" title="Click to subscribe to our Youtube channel." target="_blank">
                                    <div class="social-even">
                                    <h3 class="social">Youtube</h3>
                                    <p class="social">Entire practice sessions, special event videos, VODS and casts get uploaded to our youtube channel. click here to subscribe.
                                </p>
                                <p class="social">youtube.com/DarkOnyxFTW</p>
                            </div>
                      </a>
                      <a href="http://www.twitter.com/DarkOnyxFTW" title="Click to go to our twitter page." target="_blank">
                                    <div class="social-odd">
                                    <h3 class="social">Twitter</h3>
                                    <p class="social">Everytime we upload a youtube video or our stream goes online on twitch.tv/DarkOnyxFTW, you will know about it if you follow our twitter account.
                                </p>
                                <p class="social">twitter.com/DarkOnyxFTW</p>
                            </div>
                        </a>
                        <a href="http://www.twitch.tv/DarkOnyxFTW" title="Click to go to our twitch.tv channel." target="_blank">
                                    <div class="social-even">
                                    <h3 class="social">Live Stream<br>@ Twitch.tv</h3>
                                    <p class="social">We live stream our practices every Monday, Wednesday and Thursday at 7PM PST (9PM Central). Follow our twitch channel to get an email notification when we go live. We will also be streaming clan battles and other special events, so keep an eye on your inbox for that.
                                </p>
                                <p class="social">twitch.tv/DarkOnyxFTW</p>
                            </div>
                        </a>
                        <a href="http://www.teamliquid.net/blog/DarkOnyx" title="Our TeamLiquid Blog" target="_blank">
                                    <div class="social-odd">
                                    <h3 class="social">Team Liquid Blog</h3>
                                    <p class="social">Click here for player interviews, clan war information and much more.
                                </p>
                                <p class="social">teamliquid.net/blog/DarkOnyx</p>
                            </div>
                        </a>
                    </div>
                </ul>
    </div>
    <div id="body-middle">

    </div>
    <div id="body-right">

    </div>
</div>
<div id="footercontainer">
    <div style="width:590px; padding-left:10px; padding-top:10px;">Site by Alex "Xzar" Mohr</div>
    <div id="footer-nav" style="" align="right">
        <ul>
            <li><a href="/about/about.html">About</a></li> | 
            <li><a href="/contact/contact.html">Contact</a></li>
        </ul>
    </div>
</div>

Alex“Xzar”Mohr现场

|

这是我的css：

---

这将高度限制为1000px，这小于文本的长度。

如果我去掉它，它根本不会显示正文的背景，但文本保持在那里。如果我将其更改为最小高度，它仍然不会变高。如果从

#body container

中删除高度限制，并从

#body left

中删除

高度：100px

，从

#body left

中删除

浮动：left

，又会发生什么？如果我删除浮动：left，它们不会彼此不在一起？

#bodycontainer{
    width:100%;
    height:1000px;
    background: rgba(0,0,0,0.9);
}