大divの中に小divを配置して回り込ませる方法。
大divの中に小div3つを配置したいのですが、回り込み及び、小divの枠線の表示ができません。配置は大div clearの中の左側にdiv menu、右側にdiv contents、下部にdiv footerを配置したいと思っていますが、回り込みができず、表示したい箇所は下記のように表示されてしまいます。
• xxxx
• xxxxx
• xxxxx
xxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxx
更にliタグの・を消したいのですが、cssにlist-style-type:noneと記述しても消すことができませんでした。
記述のどこに問題がありますか？
ご教授お願い致します。
(css)
div#image {margin-left : auto ; margin-right : auto ;width:800px;border:solid 1px
#660000;}
div#container {margin-left : auto ; margin-right : auto
;width:800px;height:30px;background-color:#000000;border:solid 1px #660000;}
h1 {margin:0px;color:#330000;font-family:Geogia,Times New Roman,sans-selif;}
h2 {font-size:18px;padding-left:20px;padding-
top:5px;margin:0px;color:#ffffff;font-family:Geogia,Times New Roman,sans-selif;}
div#clear{border:solid 1px #660000;margin-left : auto ; margin-right : auto
;width:800px;height:1500px;background-color:#ffffff;]
ul {border:1px solid #660000;}
li {list-style-type:none;}
h3 {font-color:#ffffff;}
p {font-color:#ffffff;}
div#menu {border:solid 1px #660000;width:100px;height:200px;float:left;}
div#contents {border:solid 1px #660000;width:500px;height:700px;float:right;}
div#footer {border:solid 1px #660000;width:700px;height:100px;clear:both;}
(html)
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en"
"http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type"
content="text/html;charset=Shift_JIS"/>
<title>xxxxxxx</title>
<link href="./style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="image">
<h1><img src="xxxxxx.jpg" alt="xxxxxxxxx" /></h1>
</div>
<div id="container">
<h2>xxxxxxxxxxx </h2>
</div>
<br>
<div id="clear">
<div id="menu">
<ul>
<li> xxxxxx </li>
<li> xxxxxx </li>
<li> xxxxxx </li>
</ul>
</div>
<div id="contents">
<h3>xxxxxxxxxx</h3>
<p>xxxxxxxxxxx</p>
<p>xxxxxxxxxxx</p>
<br>
<p>xxxxxxxxxxxxxxxxxx</p>
</div>
<div id="footer">
<p>xxxxxxxx</p>
</div>
</div>
</body>
</html>
お礼
ありがとうございました。