• ベストアンサー

divタグで位置を指定したい

お世話になります。 ホームページを作成しています。 写真がメインのページになりますので、基本的に文章は余りありませんが、 左下に少し更新用の文章があるようにしたいです。 この場合divタグを使用して下に持ってくる場合はどのようにすればよいのでしょうか? マージンで調整したのですが、文字が増えてくると下に飛び出したりして不安定になって困っています。 お願いします。

質問者が選んだベストアンサー

  • ベストアンサー
  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.1

基本的なこと 『DIV要素(とSPAN要素)は、id属性及び class属性と併用することで、文書に構造を付加するための一般機構を提供する ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/global.html#h-7.5.4 )』ためにあるのです。  よって 「divによって新着情報であるとマークアップされている要素をウィンドウの左下に常に表示したい」  と考えましょう。  新着情報は通常footer内に存在することが多いでしょう。とすればマークアップはHTML5的に記述すると <body>  <header>  </header>  <section>  </section>  <footer>   <aside>    <h3>新着情報</h3>    <ol>     <li></li>     <li></li>    </ol>   </aside>  </footer> </body>  とかになっていると思います。HTM4.01,XHTML1.0,XHTMLでしたら、それぞれ<div class="header">のようになるでしょう。 [HTML4.01]でしたら、 <body>  <div class="header">  </div>  <div class="section">  </div>  <div class="footer">   <div class="aside" id="latestInformation">    <h3>新着情報</h3>    <ol>     <li></li>     <li></li>    </ol>   </div>  </div> </body> として、スタイルシートは #lastInformation{   width:360px;   osition:fixed;   bottom:0; } #lastInformation h3{   font-size:1.1em;   margin:0;line-height:1.4em; } とかになります。  ★ただし、この場合div.footerのpositionがstaticであることが必要です。

関連するQ&A