Картинка в углу сайта

[Romanychch]

Наткнулся на шаблон для CMS Joomla Для просмотра ссылки Войди или Зарегистрируйся . Сам шаблон не интересует, а вот фишка мне понравилась:
в углу сайта есть угловая картинка (помидор, перец).
Как мне его поставить у себя на сайте ? Я в CSS не силён, но кое что сделал:
- Сохранил картинку footer-tomatoes.png себе на сайт
- Подключил скопированый CSS код к своей странице (через модуль Custom CSS)
.bt-copyright-front-wrapper .tomatoes {
position: absolute;
bottom: 0;
right: 0;
display: block;
width: 305px;
height: 375px;
background-image:url(Для просмотра ссылки Войди или Зарегистрируйся); (я указал путь к картинке СВОЕГО сайта)
background-position: right top;
background-repeat: no-repeat;

А дальше как ? Картинка не появилась, как её вывести ?

 

[Provokator86]

На странице сайта <div class="bt-copyright-front-wrapper tomatoes">
разместил?

 

[Romanychch]

На странице сайта <div class="bt-copyright-front-wrapper tomatoes">
разместил?

Этот код надо поместить в статью, верно ? Поместил - помидора нет (

 

[Provokator86]

Этот код надо поместить в статью, верно ? Поместил - помидора нет (

В файл шаблона статьи или чего другого.
В хроме смотришь? Правой кнопкой мыши в браузере(просмотреть код) и смотри валидацию путей к картинке и стили подключены или нет.

 

[HAT]

в этом уроке всё как раз про картинку в углу

 

[uniqueart]

Проверь путь к картинке, может быть надо прописать так:

background-image:url('/images/skin1/layout/footer-tomatoes.png');

еще добавь свойство в css для этого .bt-copyright-front-wrapper .tomatoes

.bt-copyright-front-wrapper .tomatoes {
   z-index: 99;
}

а еще лучше кинь код страницы, посмотреть где у тебя лежит этот блок, пиши в ЛС помогу.

 

[Дэнио]

И не забудьте про:

pointer-events:none;

если эта картинка будет находить на какие-то важные элементы или кнопки.

Даже в этом шаблоне, перцы, находя на текст не позволяют его выделять.

 

[duncan]

предположим, что у тебя есть самый нижний айди #footer, тогда что-то вроде:

#footer{ position:relative;}
#footer:after{ content:''; background: url('http://demo.bonusthemes.com/057-ilgusto-j3/templates/bt_ilgusto/images/skin1/layout/footer-tomatoes.png'); position:absolute; bottom:0; right:0; z-index:1; wight:375px; height:305px;}

 

[Relimeyt]

Проверь не перекрывается ли она у тебя другими элементами.
Если да, то как написано выше - z-index, но важно что бы и у перекрывающего элемента он тоже был + позиционирование, т.е. в стилях у него должно быть position:relative/absolute