Css div内容溢出，内联块无用_Css_Html

Css div内容溢出，内联块无用

css html

Css div内容溢出，内联块无用,css,html,Css,Html,我是一个自学网页设计的人，所以我可能会错过一些基本的编码因此，问题是内容在一行中从右侧溢出了div 代码如下所示 HTML <html> <head> <link rel="stylesheet" type="text/css" href="style.css"> <title></title> </head> <body> <div id="bg"> &

我是一个自学网页设计的人，所以我可能会错过一些基本的编码

因此，问题是内容在一行中从右侧溢出了div

代码如下所示

HTML

<html>
<head>
    <link rel="stylesheet" type="text/css" href="style.css">

    <title></title>
</head>

<body>
    <div id="bg">
        <div id="mainwrapper">
            <div id="header">
                <div id="logo"></div>
            </div>

            <div id="contentwrapper">
                <div id="leftwrapper">
                    <div id="contentspacing">
                        <div id="content">
                            <p>
                                asdfasdfasdfasdvvasdvasdvasdvfasdvsdasdas 
                                dfasdfasdfasdvvasdvasdvasdvfasdvsdasdasdfasdfas
                            </p>
                        </div>
                    </div>
                </div>

                <div id="rightwrapper">
                    asdfasdf
                </div>
            </div>
        </div>
    </div>
</body>
</html>



asdfasdfasdfasdvasdvasdvasdvasdvfasdvsdasdas
DFASDFASDFASDVASDVASDVASDVASDVFASDVSDADSDASDFASDFAS

asdfasdf

CSS如下所示

/* ---------------------------------------------------------------*/
/* --------------------->  RESET  <<<-------------------------*/
/* ---------------------------------------------------------------*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}

body {
line-height:1;
}

body {
font-family:Arial,sans-serif;
font-size:100%;
line-height:1.3em;
_font-size:16px;
color:#504e45;
background:#ebe9e1 url(pics/bg.jpg) top left repeat-x;
}

#bg {
float:left;
display:block;
height:600px;
width:100%;
background:url(pics/hotel-bg.jpg) top center no-repeat;
margin:0 0 0 0;
}

#mainwrapper {
float:left;
display:block;
width:1000px;
margin:0 auto;
}

#header {
float:left;
display:block;
}

#logo {
width:274px;
height:44px;
background:url(pics/logo.png) no-repeat;
margin:50 0 0 100;
}

p {
float:left;
display:inline-block;
line-height:1.7em;
margin:1em 0;
-webkit-margin-before:1em;
-webkit-margin-after:1em;
-webkit-margin-start:0px;
-webkit-margin-end:0px;
}

#contentwrapper {
float:left;
display:block;
width:1000px;
}

#leftwrapper {
float:left;
display:block;
width:593px;
}

#contentspacing {
float:left;
display:block;
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}

#content {
float:left;
display:block;
height:auto;
width:593px;
border:1px solid #bdc9f4;
background:url(pics/bg2.png) top left repeat-x;
margin:35 120;
}

#rightwrapper {
float:left;
display:block;
}

/*---------------------------------------------------------------*/
/*---------------->RESET当您使用较长的单词时，会发生这种情况。试试这个：
word-wrap: no-break;

添加换行：断开单词；单词break：打破一切至#内容
这里演示
我应该在哪里使用它？在处？或者p
或者div
应该可以。嗯，你是对的，问题是我用来测试的单词太长了，这在cupidvogel有很多问题