@Arbusik

Как опустить подвал так, что бы он был под картинкой, а не ниже?

HTML
</head>
    
    <body>
    <ul id="navbar">
        <li><a href="#">Главная</a></li>
        <li><a href="#">Категории</a>
          <ul>
            <li><a href="#">Диваны</a></li>
            <li><a href="#">Кровати</a></li>
            <li><a href="#">Кресла</a></li>
          </ul>
        </li>
        <li><a href="#">Контакты</a>
          <ul>
            <li><a href="#">Адрес</a></li>
            <li><a href="#">Телефон</a></li>
            <li><a href="#">Email</a></li>
          </ul>
        </li>
        <li><a href="#">О нас</a></li>
      </ul>
      <div class="image-wrap">
        <img src="Logotip.png" >
     </div>
     <div class="container">
      <div class="block"><h2>Заголовок</h2></div>
    </div>
   <div class="title">
     <div class="block"><h2>Заголовок</h2></div>
   </div>
   <body>
    <div id="wrapper">
    <header id="header"> </header>
    <div id="content"> </div>
    </div>
    <footer id="footer"> </footer>
    </body>
    <div id="maket"></div>
    <div class="footer_main">
        <div class="footer">	
        <div class="clear_footer">	
       <div class="description">
        <div class="tet_header">	
        О НАС	
        </div>	
        <a href="#" class="my__link_big b-link_white b-link_block glow_undecorate">Доставка</a>	
        <a href="#" class="my__link_big b-link_white b-link_block glow_undecorate">Наши марки</a>	
        <a href="#" class="my__link_big b-link_white b-link_block glow_undecorate">Наша компания</a>	
        </div>	
        </div>	
        <div class="bem_sitemap">	
        <div class="size_block">
       <div class="footer-title">
        Категории	
        </div>	
        <div class="b-sitemap__links">	
        <a href="#" class="my__link_big b-link_white b-link_block glow_undecorate">Диваны</a>	
        <a href="#" class="my__link_big b-link_white b-link_block glow_undecorate">Кровати</a>	
        <a href="#" class="my__link_big b-link_white b-link_block glow_undecorate">Кресла</a>	
        <a href="#" class="my__link_big b-link_white b-link_block glow_undecorate">Аксессуары</a>	
        </div>	
        </div>	
        </div>	
       
        <div class="bem_sitemap">	
        <div class="size_block">	
        <div class="footer-title">	
        Контакты	
        </div>	
        <div class="b-sitemap__links">	
        <a  class="my__link_big b-link_white b-link_block glow_undecorate">пр.Космонавтов 19</a>	
        <a  class="my__link_big b-link_white b-link_block glow_undecorate">+7(963)-258-71-11</a>	
        <a  class="my__link_big b-link_white b-link_block glow_undecorate">arbus@mail.ru</a>	
        </div>	
        </div>	
        <div class="b-footer__logo">	
        <div class="b-footer-logo">	
        <div class="logo_align">	
        </div>	
        </div>	
        </div>	
    
    </body>
CSS
body{
  background-image: url(foto.jpg);
  background-size: 100%;
}
#navbar ul {
  display: none;
  background-color: #f90;
  position: absolute;
  top: 100%;
  }
#navbar li:hover ul { display: block; }
#navbar, #navbar ul {
margin: 0;
padding: 0;
list-style-type: none;
}
#navbar {
  height: 30px;
  background-color: #666;
  padding-left: 25px;
  min-width: 470px;
  }
#navbar li {
  float: left;
  position: relative;
  height: 100%;
  }
#navbar ul li { float: none; }
#navbar li:hover { background-color: #f90; }
#navbar ul li:hover { background-color: #666; }


#navbar {
margin: 0;
padding:0;
list-style-type: none;
border: 1.5px solid #000000;
border-radius: 15px 15px;
width: 100%;
text-align:center;
background-color: #f6c118;
}
#navbar li { display: inline; }
#navbar a {
color: rgb(0, 0, 0);
padding: 5px 10px;
text-decoration: none;
font-weight: bolder;
display: inline-block;
width: 270px;
}
#navbar a:hover {
  border-radius: 15px 15px;
  background-color: #FFDEAD;
  }
.cellar {
  height: 40px;
  width: 100%;
      margin-top: 50px;
  position: absolute;
  left: 0px;
  bottom: 0px;
      background: linear-gradient(#696969 0%, #000000);
      font-size: 26px;
      color: #A9A9A9;
  vertical-align: bottom;
      float: bottom;
}
l{
  position: top;}

   img{
     display: block;
     margin:auto ;
     width: 400px;
     height: 250px;
     border: 1.5px solid #FFDEAD;
     border-radius: 15px;
     padding: 2px;
     
   }
   .container{
    position: relative;
    float: right;
  margin-right: 1100px;
  color: #FFDEAD;
}
.block {
  position: absolute;
  top: -270px;
}
.title{
  position: relative;
  float: right;
  margin-right: 250px;
  color:#FFDEAD
  }
    html {
      height: 100%;
    }
    body {
      height: 100%;
    }
    #wrapper {
      
      min-height: 100%;
      height: auto !important;
      height: 100%;
    }
    #content {
      padding: 100px;	
    }
    body, html {
        margin:0px;
        padding:0px;
        height: 100%;
        }
       
            .my__link_big,.my__link {
                color:#2b2828;
                font-size:14.4px;
            }
             
            .footer_main {
                margin: top 10px;
                font-family: 'Scada', sans-serif;	
            }
           .clear_footer,.b-footer__social,.bem_sitemap {
                margin-top:12px;
                margin-left:18px;
                padding-left:26px;
                float:left;	
            }
              .description {
                width:280px;
            }
            
            .b-link_block {
                margin-top:12px;
                display:block;
            }
          
            .footer {
              background-color: #231f20;
              color: white;
              display: block;
              height: 150px;
              left: 0;
              position: absolute;
              width: 100%;
          }
  • Вопрос задан
  • 120 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы