0

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

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

我尝试设置bodycontainer的高度，bodycontainer的最小高度，以及bodycontainer中的div。

这是正在发生的事情的屏幕截图：http: //i.imgur.com/6dYRf.jpg

这是我的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>

这是我的 CSS：http ://darkonyx.webatu.com/style2.css

4

1 回答 1

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

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

于 2012-11-24T02:04:28.420 回答