Как сделать картинку на всю ширину CSS
Kosten
Понедельник, 20 Ноября 2017, 13:59 | Сообщение 1
Приветствую,тема такая, поставил штору, что при наведение на вид материалов появляется прозрасно темный фон, но дело в том, что некоторые материалы, а точнее изображение не на всю ширину. Вот код, где вид материала заменил.Код
<div class="box" style="background:url($IMG_URL1$) no-repeat 50% 50%;"> <a href="$ENTRY_URL$"><div class="overlay"> <span class="search"><img src="http://forums.ucoz.com/Atreer/search.png"></span> </div></a> </div>
Как понимаю, зависит все от no-repeat 50% 50%; - где весь интернет перевернул и ответа не нашел, а 50% 50% отвечает за центр. Что нужно сделать, чтоб на всю ширину картинка была. Вот пример: Сайт где проверяю и где установлено - forums.ucoz.comКод
background-position: 50% 50%;
картинка будет по центру;Код
background-position: right bottom;
правый нижний угол;Код
background-position: 50px 100px;
отступ 50px от левого края и 100px от верхнего;Код
background-position: 0 100%;
левый нижний угол;Код
background-position: left bottom;
левый нижний угол. Так работает этот эффект, но как сказано, не все картинки идут на всю ширину, а только большие, как эта.
Страна: (RU )
-SAM-
Понедельник, 20 Ноября 2017, 14:24 | Сообщение 2
Уже разбиралось здесь : нужно задать масштабирование, что идёт background-size:cover!important;width:100%;max-width:100% ... ну, а чтобы "штора" покрыла всё изображение, то убрать padding там нужно, а также закругление бортов чтобы было, как у изображения.
Помог? Скажи спасибо в виде "+" - вам мелочь, а мне приятно. Бесплатное оказание помощи в ответах на "Вопросы про uCoz".
Страна: (UA )
Kosten
Понедельник, 20 Ноября 2017, 14:25 | Сообщение 3
-SAM-, вот знаю, что разбор по этой теме был, реально вчера искал и сегодня, и не нашел.
Страна: (RU )
Kosten
Понедельник, 20 Ноября 2017, 14:30 | Сообщение 4
Если только так поставить, но идет автоматический показ, хотя он и по идее должен. Заменитьno-repeat 50% 50%; наno-repeat;background-size: cover;
Страна: (RU )
-SAM-
Понедельник, 20 Ноября 2017, 14:31 | Сообщение 5
Kosten, http://htmlbook.ru/css/background-size - вот, если не нужно, чтобы фон делался так, как с cover.
Помог? Скажи спасибо в виде "+" - вам мелочь, а мне приятно. Бесплатное оказание помощи в ответах на "Вопросы про uCoz".
Страна: (UA )
Kosten
Понедельник, 20 Ноября 2017, 14:33 | Сообщение 6
-SAM-, плиз, подскажи, вчера ушитался на думку, просто на этом вид материалов не мог корректно вывести рейтинг под свой стиль.
Страна: (RU )
Kosten
Понедельник, 20 Ноября 2017, 14:38 | Сообщение 7
Цитата -SAM- (
)
вот, если не нужно, чтобы фон делался так, как с cover.
И так все выходи, но 100 много, так если только вверх показывать, то ставить.
Страна: (RU )