4
Pタグを作成してコードで埋めるたびに、新しい行を作成するのではなくオーバーフローします。 CSS：改行を作成するのではなく、段落タグがオーバーフローするのはなぜですか？
#main {
width: 700px;
margin-right: auto;
margin-left: auto;
font-family: Arial, Helvetica, sans-serif;
}
#main #top h1 {
text-align: center;
font-size: 48px;
margin: 0;
}
#main #menucontainer {
width: 700px;
border: 1px solid black;
}
#main #menucontainer ul {
list-style-type: none;
margin: 0 auto;
padding: 0px;
width: 255px;
}
#main #menucontainer ul li a {
font-size: 18px;
text-decoration: none;
color: #000;
display: block;
padding: 5px 10px;
text-align: center;
float: left;
border-left-width: 1px;
border-left-style: solid;
border-left-color: #000;
}
#main #menucontainer ul li a:hover {
background-color: black;
color: white;
}
#main #menucontainer ul li a.current {
background-color:#CCC;
color: black;
}
#main #footer {
margin-top: 10px;
text-align: center;
font-style:italic;
}
はHTML：新しい行にテキストを破る<p>タグのための場所がないので、
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Home</title>
<link href="styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="main">
<div id="top">
<h1>Home</h1>
</div>
<div id="menucontainer">
<ul>
<li><a href="index.php" class="current">Home</a></li>
<li><a href="submit.php">Submit</a></li>
<li><a href="contactus.php" style="border-right:solid 1px black;">Contact Us</a></li>
</ul>
<div style="clear:both;"></div>
</div>
<p>asdfhsadfkjasdjkcnakdsjnfkjdsanckjdsanfjkhaskjcnjksdankjfhasdknjcnadsjkfhkjsdhfkjncjsdnfjaksdhfkjadshfjkcndasjknf</p>
<div id="footer">2011</div>
</div>
</body>
</html>
これは機能しますhttp://jsfiddle.net/BgGRL/ –
@Grillzあまりにも役に立ちました。 – John