HTMLで文字が重なって表示されます

HTMLでテキストを入れると文字が重なって左上に全て表示されてしまいます。
また改行も反映されません。

以下のような構成ですが、どのようにすれば、
テキストが普通に表示され改行も反映するでしょうか？

【HTML】

<div id="add">
<p>ああああああああああああああ</p>
<p>いいいいいいいいいいいいいい</p>
<p>ううううううううううううう</p>
</div>

【関連CSS】

#address{
position:relative;
width:921px;
height:308px;
margin:0 auto 50px;
}
#address #logo{
position:absolute;
left:0px;
top:0px;
}
#address #add{
position:absolute;
left:0px;
top:56px;
}
#address #map{
position:absolute;
left:461px;
top:0px;

No.3 回答者： t_fumiaki 回答日時： 2016/07/16 17:10

本当に困ってるんだったら、urlを提示しないと誰も解らないヨ。

No.2 回答者： t_fumiaki 回答日時： 2016/07/16 09:57

htmlとcssの全体を見ないと何とも言えない。

書いているhtmlタグ順序も関係するし、cssの他の部分の影響もある。
示されているcssとhtmlの範囲内では文字が重なる事は無い。

No.1 回答者： t_fumiaki 回答日時： 2016/07/15 23:37

このCSSを使うならaddressの子要素としてaddが居ないと機能しない。

以下にする。

<div id="address">　←追加
<div id="add">
<p>ああああああああああああああ</p>
<p>いいいいいいいいいいいいいい</p>
<p>ううううううううううううう</p>
</div>
</div>　←追加

この回答へのお礼

ご回答ありがとうございます。
しかし修正してみましたがダメでした。。

こちらのCSSが影響していそうです。

#footerarea{
width:100%;
height:454px;
margin:0;
}
#footerarea #footercon{
position:relative;
width:921px;
margin:0 auto;
}
#footerarea #footercon #footer{
position:absolute;
left:0px;
top:60px;
}
#footerarea #footercon #footer #logo{
position:absolute;
left:0px;
top:0px;
}
#footerarea #footercon #footer #add{
position:absolute;
left:0px;
top:56px;

どのようにCSSの設定を直せば、正常にテキストが掲載され、
またBRやPタグも反映されるようになるでしょうか？

お礼日時：2016/07/16 07:32