Помощь Помогите с версткой

Тема в разделе "Opencart", создана пользователем ioh, 4 сен 2014.

Информация :
Внимание форумчане! При создании тем, или выкладывании какой-либо информации проверьте в какой ветке форума вы находитесь! Не путайте Opencart и Opencart2. При несоблюдении данного условия выносится соответствующее наказание! И потом не говорите что вас НЕ ПРЕДУПРЕЖДАЛИ! По возможности используйте обменники mail, yandex, google, dropbox, rghost Дабы избежать просьб перезалить и проблем с рекламой!
Модераторы: ZiX
  1. ioh

    ioh

    Регистр.:
    24 сен 2013
    Сообщения:
    181
    Симпатии:
    4
    Не отображается картинка футера на планшетах, а на мониторах и ноутбуках все видно. Разбираюсь во всем сама. Может кто подскажет, где ошибка.
    http://sashulya.com.ua
     
  2. inturned

    inturned Webmaster & Designer

    Регистр.:
    7 ноя 2011
    Сообщения:
    537
    Симпатии:
    257
    По факту, попробуйте изображение прописать не в html, а через css. Сейчас у Вас изображение прописано в HTML, а вместо него в
    Код:
    <div id="footer">
    -- Здесь --
    </div>
    Сейчас так:
    Код:
    <div id="footer">
    <div style="left: 52%;
      margin-left: -850px;
      position: absolute;
      margin-top: -450px;
      z-index: -2">
      <img src="/images-new/footer_image.png" /></div>
    </div>
    Пропишите так:
    Код:
    <div id="footer">
    <div id="footer-image>
    </div>
    </div>
    Соответственно в файле stylesheet.css создайте ид footer-image
    Код:
    #footer-image {
      background: url('../images-new/footer_image.png');
      left: 52%;
      margin-left: -850px;
      position: absolute;
      margin-top: -450px;
      z-index: -2
    }
    
    Может получится
     
  3. ioh

    ioh

    Регистр.:
    24 сен 2013
    Сообщения:
    181
    Симпатии:
    4
    Сделала, но съехал весь футер и картинки не видно
     
  4. inturned

    inturned Webmaster & Designer

    Регистр.:
    7 ноя 2011
    Сообщения:
    537
    Симпатии:
    257
    у вас должно быть что-то типа такого в footer.tpl
    Код:
    <div id="footer">
      <div id="footer-image">
        <div class="column"></div>
        <div class="column"></div>
        <div class="column"></div>
       <div class="column"></div>
      </div>
    <div>
    
    А у вас сейчас по исходному коду так:
    css.png

    соответственно:
    Код:
    <div id="footer">
      <div id="footer-image"> - ЭТО --></div>
    - ЭТО --></div>
    ........
    
    Необходимо перенести после последнего класса:
    Код:
    <div class="column">.....</div>
    <!-- Вот сюда -->
    </div>
    </div>
    
    А у вас сейчас не правильно, я думал вы знаете :)
     
  5. ioh

    ioh

    Регистр.:
    24 сен 2013
    Сообщения:
    181
    Симпатии:
    4
    нее, я не совсем разбираюсь, или, скорее, почти совсем не разбираюсь. Учусь пока только
    Но после переноса лучше не стало. Может я опять не так поняла?
     
  6. inturned

    inturned Webmaster & Designer

    Регистр.:
    7 ноя 2011
    Сообщения:
    537
    Симпатии:
    257
    Угу, не правильно, верните все обратно.
    Смотрите у вас должно быть так:
    <div id="footer">
    <div id="footer-image">
    Дальше идут 4 блока column, смотрите где закрывается последний 4 блок column
    Типа так:
    <div class="column">...какой-то код...</div>
    <div class="column">...какой-то код...</div>
    <div class="column">...какой-то код...</div>
    <div class="column">...какой-то код...</div>
    После последнего column где закрывает его </div> вы должны поставить еще 2 раза </div></div>

    А около
    <div id="footer">
    <div id="footer-image">
    Их удалить, иначе вы нарушаете верстку и у вас все "едет"

    Если не разберетесь, то верните все как было до написания этого топика, а я уже завтра помогу вам на примере.
    а сейчас уже простите, пора спать. И так засиделся
     
  7. ioh

    ioh

    Регистр.:
    24 сен 2013
    Сообщения:
    181
    Симпатии:
    4
    спасибо, сейчас буду пробовать. Спокойной ночи.
     
  8. inturned

    inturned Webmaster & Designer

    Регистр.:
    7 ноя 2011
    Сообщения:
    537
    Симпатии:
    257
    У меня под рукой оказался похожий код на ваш.
    Смотрите внимательней изображение ниже, я одинаковыми цвета подчеркнул то, как должно быть, посмотрите внимательно и сделайте также и все будет должно работать.
    Это файл FOOTER.TPL

    11111.png

    P.S. В разработке очень помогает текстовый редактор с подсветкой синтаксиса, например, Notepad++
    Удачи в начинаниях и спокойной ночи:hello:
     
  9. ioh

    ioh

    Регистр.:
    24 сен 2013
    Сообщения:
    181
    Симпатии:
    4
    Спасибо. Но из-за стилей самой картинки футер ушел вверх и влево. Пришлось убрать все стили картинки и футер вернулся. До завтра пока оставила футер без оной. А Вы если сможете, гляньте?