使用CSS布局基础的DIV

Question

大家好，我正在尝试创建一个布局，并理解使用CSS和div。似乎我很难让中间的列固定在中心，因为每次我输入一个长文本，它都会超出右列，有什么最好的方法来避免这种情况呢？有没有更容易理解的方法？我是初学者，我曾经使用过表和TD，它更容易理解，但我正在努力赶上div，因为表和行似乎过时了。请帮帮忙谢谢。

下面是我的代码：http://jsfiddle.net/CVXKn/2/

<div id="wrapper" align="center">

        <div id="wrapper_inner">

            <div id="menubar">MENU BAR GOES HERE</div>

            <div id="headerContainer">Header LOGO Goes here</div>

            <div id="bodyContainer">

                <div id="left"> </div>

                <div id="center"> gegggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggg</div>
                    <div id="centerEnter"> </div>

                <div id="right"> </div>
                <div class="clear"> </div>

            </div>   

            <div id="footerContainer">Footer Goes Here</div>

         </div>

     </div>  

Answer 1

将这个添加到你的CSS中，这将打破长单词

#center {
    word-wrap:break-word;
}

Answer 2

word-wrap: break-word;

在中心div的CSS中应该可以修复它。

Answer 3

您的问题是，您正在使用一个完整的“单词”来测试您的布局。当没有足够的空间容纳下一个单词时，句子将被截断，并强制换行，直到没有更多的文本。

正如其他人所指出的，如果您需要使用大量会破坏您的布局的大词，请在适当的地方使用word-wrap: break-word;来中断它们。