Блоки налезают друг на друга

ProMira · March 26, 2012

Собственно проблема в том, что DIV'ы лезут друг на друга.

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" lang="en" xml:lang="en">
 <head>
  <title>Alter Bridge Fan-Club</title>
  <link rel="stylesheet" href="style.css" type="text/css" media="screen" charset="utf-8" />
 </head>
 <body>
<!--HEAD-->
  <div id="head">
   <div id="hleft">
    <table class="menu">
     <tr>
      <td class="name">Навигация</td>
     </tr>
     <tr>
      <td>
       <ul>
        <li>link 1</li>
        <li>link 2</li>
        <li>link 3</li>
        <li>link 4</li>
        <li>link 5</li>
       </ul>
      </td>
     </tr>
    </table>
   </div>
   <div id="hright">
    <p id="link"><img src="img/link.png" alt="link"/></p>
    <br/>
    <table class="menu">
     <tr>
      <td>Мы в соц. сетях</td>
     </tr>
     <tr>
      <td><p><img src="img/mm.png" alt="mm"/><br/><br/><img src="img/vk.gif" alt="vk"/></p></td>
     </tr>
    </table>
   </div>
  </div>
<!--HEAD_END-->
<!--CONT-->
  <div id="body">
   <p id="news">Новости</p>
   <table>
    <tr>
     <td><p>Заголовок</p></td>
    </tr>
    <tr>
     <td><p>Сама новость</p></td>
    </tr>
    <tr>
     <td><p id="nothers">Новость добавил: *** | Дата: ***</p></td>
    </tr>
   </table>
  </div>
<!--CONT_END-->
  <div id="end">
   <p id="copy">CopyRight</p>
  </div>
 </body>
</html>

CSS:

BODY {
 background-color: #000000;
 margin:0;
 padding: 0;
 min-width: 1024px;
 }

.name {
 text-align: center;
 }

#head {
 top: 0;
 left: 50%;
 margin-left: -500px;
 position: absolute;
 width: 100%;
 height: 360px;
 background-image:url('img/head.jpg');
 background-repeat: no-repeat;
 }

#hleft {
 position: fixed;
 width: 50%;
 padding: 5%;
 float: left;
 }

.menu {
 border: 1px solid black;
 border-radius: 10px;
 width: 150px;
 height: 150px;
 background: rgba(120, 120, 120, 0.3);
 }

#hright {
 position: relative;
 width: 50%;
 padding-left: 30%;
 float: right;
 }


#body {
 background-color: #c8af7b;
 width: 512px;
 margin: 0 auto;
 }

Yazon_Nile · March 27, 2012

Не телепат,

какие дивы?

Sign In

Блоки налезают друг на друга

Question

ProMira

Link to comment

Share on other sites

1 answer to this question

Recommended Posts

Yazon_Nile

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information