- Форум
- Шаблоны Joomla.
- HTML и CSS
- Как вставить по правому и левому краю изображения!
Как вставить по правому и левому краю изображения!
Murad / Автор темы \
Прохожий

5
0
10 года 8 мес. назад - 10 года 8 мес. назад #4877 от Murad
Вот сайт
dlya-klienta.ru/ и по левому и правому краю хотел поставить png формата у меня криво получается, шаблон расходится, шаблон называется mega_siena, примерно так:
Последнее редактирование: 10 года 8 мес. назад от Murad. Причина: Не правильно сформулировал вопрос
Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.
Murad / Автор темы \
Прохожий

5
0
10 года 8 мес. назад #4878 от Murad
Это учебный проект не смейтесь над моим бардаком))))
Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.
VARion

Web-Мастер

166
15
27
10 года 7 мес. назад #4900 от VARion
Murad, добавьте для левого изображения CSS:для правого:
Смещение в 320px чтобы они у вас не перекрывались с верхней шапкой. Отрегулируйте, как нужно.
.mega_wrapper {background: url("../images/left-image.png") no-repeat 0 320px transparent;}
.mega_wrapper_i {background: url("../images/right-image.png") no-repeat 100% 320px transparent;}
Смещение в 320px чтобы они у вас не перекрывались с верхней шапкой. Отрегулируйте, как нужно.
Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.
Murad / Автор темы \
Прохожий

5
0
10 года 7 мес. назад #4903 от Murad
Спасибо VARion, что откликнулся!!! Я как ты советовал вставил в сss игрался с пикселями, но картинки к сожалению не удалось увидеть(( Фотки лежат по пути как ты прописал dlya-klienta.ru/images/bgleft.png, я в css вставляю url с правильным именем png. но не как выходит. пробовал с новым div ом (div class="bgleft") и (div class="bgright") вместо .mega_wrapper прописать тоже самое. Если тебе не трудно и будет время и желание помоги мне чайнику пожалуйста!
С меня магарыч!!!
С меня магарыч!!!
Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.
VARion

Web-Мастер

166
15
27
10 года 7 мес. назад #4907 от VARion
Murad, когда я писал адрес к картинке, то предполагал, что картинка лежит в текущем шаблоне и подпапке images.
Если картинки лежат в папке /images (как сейчас), то изображение будет иметь другой путь (без точек в начале):По дополнительным дивам: не стоит их столько плодить и друг в друга вкладывать, уберите лишнее и будет проще вам разобраться и настроить и браузер быстрее загрузит более простую структуру.
Также, используйте firebug при разработке: научитесь пользоваться им и он научит вас.
Если картинки лежат в папке /images (как сейчас), то изображение будет иметь другой путь (без точек в начале):
.bgright {
background: url("/images/bgright.png") no-repeat scroll 100% 320px transparent;
}
Также, используйте firebug при разработке: научитесь пользоваться им и он научит вас.
Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.
Murad / Автор темы \
Прохожий

5
0
10 года 7 мес. назад #4914 от Murad
VARion ))) Левая картинка появилась
как ты предсказывал, по высоте выровнял все дела все отлично! Но вторая картинка bgright.png что-то не как не хочет выставиться(( Я меняю местами div ы например стоит первым div class="bgleft" вторым стоит div class="bgright", так вот, меняю их местами показывает тот див который первый стоит а второй не показывает.
P/S Понимаю, что тебе уже надоедаю, но не могу успокоиться((( Для тебя это как два пальца щелкнуть)) а для меня как видишь проблема
)))

P/S Понимаю, что тебе уже надоедаю, но не могу успокоиться((( Для тебя это как два пальца щелкнуть)) а для меня как видишь проблема

Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.
VARion

Web-Мастер

166
15
27
10 года 7 мес. назад - 10 года 7 мес. назад #4915 от VARion
Murad, тут, конечно, нужно изучать CSS как работает...
Я смотрю, ты использовал одну картинку общую, так тоже вполне возможно. Также учитывая что шарики могут повторяться, можно их тиражировать по горизонтали (repeat-x вместо no-repeat). Главное чтобы они могли повторяться без швов.
Если всё же нужно одной картинкой сделать, то тогда у неё x и y нужно ставить с выравниванием по центру: 50% 377px т.к. у разных людей разная ширина экрана, а не жёсткая 1366px.
То что отображается только одно изображения, точно не могу сказать причину. Попробуй использовать изображение с прозрачным фоном там, где сейчас серый цвет однородный в обоих изображениях.
---- Добавлю
Разобрался. Чтобы второе изображение отображалось нужно в класcе .bgright дописать overflow: hidden; без него див получается нулевого размера и, соответственно картинку не видно.
Я смотрю, ты использовал одну картинку общую, так тоже вполне возможно. Также учитывая что шарики могут повторяться, можно их тиражировать по горизонтали (repeat-x вместо no-repeat). Главное чтобы они могли повторяться без швов.
Если всё же нужно одной картинкой сделать, то тогда у неё x и y нужно ставить с выравниванием по центру: 50% 377px т.к. у разных людей разная ширина экрана, а не жёсткая 1366px.
То что отображается только одно изображения, точно не могу сказать причину. Попробуй использовать изображение с прозрачным фоном там, где сейчас серый цвет однородный в обоих изображениях.
---- Добавлю
Разобрался. Чтобы второе изображение отображалось нужно в класcе .bgright дописать overflow: hidden; без него див получается нулевого размера и, соответственно картинку не видно.
Последнее редактирование: 10 года 7 мес. назад от VARion. Причина: Добавил
Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.
Murad / Автор темы \
Прохожий

5
0
10 года 7 мес. назад - 7 года 3 нед. назад #4916 от Murad
VARion Спасибо все заработало как надо!!! урааа
Ты правильно сказал css нужно изучать, просто всегда привык гуглить, решил забыл как говориться, но теперь понял, надо изучать языки)))

Последнее редактирование: 7 года 3 нед. назад от Murad. Причина: Ошибка
Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.
- Форум
- Шаблоны Joomla.
- HTML и CSS
- Как вставить по правому и левому краю изображения!