Не прижимается футер

(Ответов: 2, Просмотров: 338)
  1. Новичок
    • Регистрация: 04.03.2016
    • Сообщений: 28
    • Репутация: 1
    Всем доброго времени суток.
    Сайт на CMS NetCat
    На этой странице сайта футер почему то не прижат к низу. На остальных страницах все нормально.
    Проблема появляется после того как на страницу добавляю объект со следующим кодом.
    Код HTML:
    <style type="text/css">
    .view {
       width: 300px;
       height: 200px;
       margin: 10px;
       float: left;
       border: 10px solid #fff;
       overflow: hidden;
       position: relative;
       text-align: center;
       -webkit-box-shadow: 1px 1px 2px #e6e6e6;
       -moz-box-shadow: 1px 1px 2px #e6e6e6;
       box-shadow: 1px 1px 2px #e6e6e6;
       cursor: default;
       background: #fff url(../images/bgimg.jpg) no-repeat center center;
    }
    .view .mask,.view .content {
       width: 300px;
       height: 200px;
       position: absolute;
       overflow: hidden;
       top: 0;
       left: 0;
    }
    .view img {
       display: block;
       position: relative;
    }
    .view h2 {
       text-transform: uppercase;
       color: #fff;
       text-align: center;
       position: relative;
       font-size: 14px;
       padding: 10px;
       background: rgba(0, 0, 0, 0.8);
       margin: 20px 0 0 0;
    }
    .view p {
       font-family: Georgia, serif;
       font-style: italic;
       font-size: 12px;
       position: relative;
       color: #fff;
       padding: 10px 20px 20px;
       text-align: center;
    }
    .view a.info {
       display: inline-block;
       text-decoration: none;
       padding: 7px 14px;
       background: #000;
       color: #fff;
       text-transform: uppercase;
       -webkit-box-shadow: 0 0 1px #000;
       -moz-box-shadow: 0 0 1px #000;
       box-shadow: 0 0 1px #000;
    }
    .view a.info: hover {
       -webkit-box-shadow: 0 0 5px #000;
       -moz-box-shadow: 0 0 5px #000;
       box-shadow: 0 0 5px #000;
    }
    
    .view-first img {
       -webkit-transition: all 0.2s linear;
       -moz-transition: all 0.2s linear;
       -o-transition: all 0.2s linear;
       -ms-transition: all 0.2s linear;
       transition: all 0.2s linear;
    }
    .view-first .mask {
       -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
       filter: alpha(opacity=0);
       opacity: 0;
       background-color: rgba(219,127,8, 0.7);
       -webkit-transition: all 0.4s ease-in-out;
       -moz-transition: all 0.4s ease-in-out;
       -o-transition: all 0.4s ease-in-out;
       -ms-transition: all 0.4s ease-in-out;
       transition: all 0.4s ease-in-out;
    }
    .view-first h2 {
       -webkit-transform: translateY(-100px);
       -moz-transform: translateY(-100px);
       -o-transform: translateY(-100px);
       -ms-transform: translateY(-100px);
       transform: translateY(-100px);
       -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
       filter: alpha(opacity=0);
       opacity: 0;
       -webkit-transition: all 0.2s ease-in-out;
       -moz-transition: all 0.2s ease-in-out;
       -o-transition: all 0.2s ease-in-out;
       -ms-transition: all 0.2s ease-in-out;
       transition: all 0.2s ease-in-out;
    }
    .view-first p {
       -webkit-transform: translateY(100px);
       -moz-transform: translateY(100px);
       -o-transform: translateY(100px);
       -ms-transform: translateY(100px);
       transform: translateY(100px);
       -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
       filter: alpha(opacity=0);
       opacity: 0;
       -webkit-transition: all 0.2s linear;
       -moz-transition: all 0.2s linear;
       -o-transition: all 0.2s linear;
       -ms-transition: all 0.2s linear;
       transition: all 0.2s linear;
    }
    .view-first:hover img {
       -webkit-transform: scale(1.1,1.1);
       -moz-transform: scale(1.1,1.1);
       -o-transform: scale(1.1,1.1);
       -ms-transform: scale(1.1,1.1);
       transform: scale(1.1,1.1);
    }
    .view-first a.info {
       -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
       filter: alpha(opacity=0);
       opacity: 0;
       -webkit-transition: all 0.2s ease-in-out;
       -moz-transition: all 0.2s ease-in-out;
       -o-transition: all 0.2s ease-in-out;
       -ms-transition: all 0.2s ease-in-out;
       transition: all 0.2s ease-in-out;
    }
    .view-first:hover .mask {
       -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
       filter: alpha(opacity=100);
       opacity: 1;
    }
    .view-first:hover h2,
    .view-first:hover p,
    .view-first:hover a.info {
       -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
       filter: alpha(opacity=100);
       opacity: 1;
       -webkit-transform: translateY(0px);
       -moz-transform: translateY(0px);
       -o-transform: translateY(0px);
       -ms-transform: translateY(0px);
       transform: translateY(0px);
    }
    .view-first:hover p {
       -webkit-transition-delay: 0.1s;
       -moz-transition-delay: 0.1s;
       -o-transition-delay: 0.1s;
       -ms-transition-delay: 0.1s;
       transition-delay: 0.1s;
    }
    .view-first:hover a.info {
       -webkit-transition-delay: 0.2s;
       -moz-transition-delay: 0.2s;
       -o-transition-delay: 0.2s;
       -ms-transition-delay: 0.2s;
       transition-delay: 0.2s;
    }
    
    .block {
    margin-left: 300px;
    }
    </style> <p>ООО &laquo;Храпуновский инструментальный завод&raquo; имеет значительный опыт работы в металлообрабатывающей отрасли. Мы специализируемся на изготовлении качественного режущего инструмента. В каталоге представлен обширный выбор резцов токарных.</p> <p>Данную оснастку активно используют:</p> <ul> <li>&nbsp;при обработке цилиндрических и фасонных поверхностей;</li> <li>&nbsp;выполнении резьбы;</li> <li>&nbsp;осуществлении долбежных и строгальных работ;</li></ul> <div class="block"> <div class="view view-first"><img src="/images/image_1.jpg" /> <div class="mask"> <h2>Металлорежущий инструмент</h2> <p>ООО &quot;Храпуновский инструментальный завод&quot; производит разнообразный металлорежущий инструмент и оснастку.</p><a class="info" href="/products/metallorezhuschiy-instrument/">Подробнее</a> </div> </div> </div>
    • 0
  2. Опытный Аватар для Vlad03
    • Регистрация: 21.05.2014
    • Сообщений: 404
    • Репутация: 33
    • Webmoney BL: ?
    maxg5,не закрыт тег div где-то, _https://validator.w3.org/nu/?doc=http%3A%2F%2Fzavodhiz.ru%2Fproducts%2F ошибки 12,13.
    <div class="wrapper footer"> залетает в <div class="wrapper_content">, поэтому не корректно считается высота.
    • 1

    Спасибо сказали:

    maxg5(14.05.2016),
  3. Дипломник Аватар для Вера Симонова
    • Регистрация: 07.05.2016
    • Сообщений: 232
    • Репутация: 36
    • Webmoney BL: ?
    • 0

Похожие темы

Темы Раздел Ответов Последний пост
Перенести JS-файлы в футер
WordPress 0 30.03.2014 13:50
Помогите розкодировать футер!
Web программирование 7 17.04.2012 00:42
в IE6 выделяется футер
Прочее 8 23.12.2010 10:43
Виджеты в футер
Вопросы от новичков 3 19.11.2010 01:18

У кого попросить инвайт?

Вы можете попросить инвайт у любого модератора:

Информеры