|
18 / 15 / 1
Регистрация: 20.04.2010
Сообщений: 318
|
|
Правый край div1 прижать к правому краю div2 через CSS25.04.2010, 04:00. Показов 68590. Ответов 47
Метки нет (Все метки)
Есть div1, внутри него div2.
Как div2 правым краем с помощью css прижать правому краю div2. Добавлено через 34 минуты бррр.))) text-align: right в сво-вах css div1.
0
|
|
| 25.04.2010, 04:00 | |
|
Ответы с готовыми решениями:
47
Прижать блок к правому краю
|
|
35 / 3 / 0
Регистрация: 22.08.2011
Сообщений: 172
|
|
| 01.01.2024, 18:29 | |
|
я могу положить на хостинг . А есть здесь сниппет , на форуме ? или на CODEPEN ? Цель простая : берется картинка и морячка. Все, других картинок нет. Бутерброд : снизу просто картинка, морячка {bottom:0; right:0;}, сверху картинка с id="image". Скрипт видит id="image" и заворачивает его, все остальное не трогает. Морячка появляется верхом на яхте. Конечно, морячка в PNG, она прозрачная и ложится на все, не то что некоторые.
0
|
|
|
35 / 3 / 0
Регистрация: 22.08.2011
Сообщений: 172
|
|||||||||||
| 01.01.2024, 18:47 | |||||||||||
И при ширине 200px ноги сами уменьшаются, масштаб очевиден, но в браузере только ее белые труселя. Все остальное за границей -- все как и в РФ , все в таких трусах -- все за кордон. К чему они привязаны ? У страницы нет ширины ! Ноги морячки привязаны к DIV . Но ноги не видят высоту DIV , т.к. ее нет, прямо не указана. Поэтому ноги привязываются к верхней границе DIV. Вот так работает CSS
0
|
|||||||||||
|
35 / 3 / 0
Регистрация: 22.08.2011
Сообщений: 172
|
|
| 01.01.2024, 19:02 | |
|
у меня только подозрение, что скрипт что-то ломает. Он отрабатывает четко -- onmousemove="increase(document.getElemen tById('image')) (внешний скрипт, там не разобраться) но что происходит с другими объектами на странице -- загадка.
Я с трудом представляю, как все это сочетается на FLEX
0
|
|
|
202 / 126 / 25
Регистрация: 09.01.2022
Сообщений: 458
|
|
| 01.01.2024, 19:05 | |
|
seregadushka,
Это то, что вам нужно? - смотри фото:
0
|
|
|
202 / 126 / 25
Регистрация: 09.01.2022
Сообщений: 458
|
|
| 01.01.2024, 19:16 | |
|
seregadushka,
А не можете ли вы использовать графическую программу, чтобы поместить два изображения друг на друга так, как вы хотите? И затем просто поместите готовое изображение в html-код!
0
|
|
|
35 / 3 / 0
Регистрация: 22.08.2011
Сообщений: 172
|
|
| 01.01.2024, 19:22 | |
|
ivanov_333, коллеги, так и было. Я могу совместить в программе. Но это же самое может делать скрипт, потом с любой картинкой (2 штуки ). Моя идея -- под морячкой копия верхней картинки, так же нагляднее.
Неужели я нашел сложную проблему для современного CSS ??? Если я поменяю исходника картинки, то скрипт сделает свою работу. Скрипт живой, уголок шевелится -- это не тайна -- вот он -- http://www.netzgesta.de/curl/ . Проще кода не бывает, уже почти все сделано. Морячка уже зажата к права. Как прижать морячку к низу ? Я уже сам путаюсь. Если в коде указать #frame , #image {width: 400px; } , то морячка прижмется к праву картинки (но СВЕРХУ ЕЕ), но как к низу ???? (я просо сместил DIV на 100рх от угла страницы, чтобы видеть масштаб повреждений этого CSS )
0
|
|
|
35 / 3 / 0
Регистрация: 22.08.2011
Сообщений: 172
|
|||||||||||
| 01.01.2024, 19:55 | |||||||||||
0
|
|||||||||||
|
35 / 3 / 0
Регистрация: 22.08.2011
Сообщений: 172
|
|
| 01.01.2024, 20:08 | |
|
еще заметил в таком режиме, когда все смещено от края страницы. Я думал, что скрипт -- не дурак, и делает только то что ему сказано -- заворачивать только id="image", и только когда мышь шевелится. Но он заворачивает id="image" еще и когда мышь над морячкой ! Точно над ней по контуру . У морячки id="layer" , по идее там нет DIV . Вот пример, когда CSS работает не пойми как.
я уже забыл, когда видел под мышью alt="Alternate text" . Куда он делся, может его уже отключили по всей планете ?
0
|
|
|
Супер-модератор
4001 / 2175 / 833
Регистрация: 13.03.2010
Сообщений: 7,075
|
||
| 01.01.2024, 20:11 | ||
|
Я так и не понял что вы хотите сделать. Всё в кучу смешиваете бездумно.
0
|
||
|
35 / 3 / 0
Регистрация: 22.08.2011
Сообщений: 172
|
|
| 01.01.2024, 20:24 | |
|
gogolik, как опустить девку на песочек ?
0
|
|
|
202 / 126 / 25
Регистрация: 09.01.2022
Сообщений: 458
|
||||||
| 01.01.2024, 22:14 | ||||||
|
seregadushka,
Итак, на мой взгляд, не может быть, чтобы и блок div, и изображения не имели заданной высоты! По крайней мере, хоть блок div должен иметь такая! И я бы не стал делать все это без установка display: flex; Вот вес код:
Столько от меня по этой теме!
0
|
||||||
|
35 / 3 / 0
Регистрация: 22.08.2011
Сообщений: 172
|
|
| 01.01.2024, 22:18 | |
|
ivanov_333, все это очень интересно, но height: 300px; легко поставить. Цель -- только указать адрес 2 картинок.. Тем более position: absolute; можно указать всем объектам -- тоже работает. В смысле, что видит только верхнюю границу DIV {position: absolute; или relative } -- одинаково.
Ширина выступает как масштаб . Если еще и высоту спрашивать, так пусть юзер сам весь сайт напишет
0
|
|
|
202 / 126 / 25
Регистрация: 09.01.2022
Сообщений: 458
|
||
| 01.01.2024, 22:25 | ||
|
Но, чтобы это работало, высота его родительского блока также должна быть установлена! (Хоть и в процентах)
0
|
||
|
35 / 3 / 0
Регистрация: 22.08.2011
Сообщений: 172
|
||
| 01.01.2024, 22:30 | ||
|
Когда я ставлю FLEX , девка слева от DIV за границей браузера.
Добавлено через 2 минуты Единственной высотой во всем этом коде -- высота корабля. Корабли бывают разные. Я указываю только ширину, чтоб ы примерно менять его размер. DIV пустой , это просто тег , не надо спрашивать у него высоту. Она равна высоте картинки с кораблем. Есть его ширина.
0
|
||
|
202 / 126 / 25
Регистрация: 09.01.2022
Сообщений: 458
|
|||||||||||||||||
| 01.01.2024, 23:09 | |||||||||||||||||
0
|
|||||||||||||||||
|
35 / 3 / 0
Регистрация: 22.08.2011
Сообщений: 172
|
|
| 01.01.2024, 23:40 | |
|
про html, body -- это понятно. У меня и так задача совсем простая -- . Так скрипт держит размер картинки , он не позволяет ее менять. Задача упрощается. Не надо делать адаптивный дизайн (нижний кораблю можно растягивать, но здесь это не к чему. ), . Я думал , все просто -- верстка как дет саду, наложить сверху 3 штуки, жесткий бутерброд, и все. С процентами не пробовал, но не особо верю. Да Flex используется только для внешнего блока, все что внутри советуют делать абсолютным. Девка еще накладывается , а заскриптованная картинка с кораблем уже нет . Я не знаю, что там с ней скрипт делает, но он всегда работает. Но положение его хрен поймешь.
У меня без FLEX уже было почти все , кроме дна корабля. С FLEX я как то словил дно, до угла не добрался, но вижу, скриптовый корабль все равно отдельно. Добавлено через 1 минуту я даже понимаю, этот CSS -- для него ничего святого не существует. Если картинки наложены в сверху углами, то пустое пространство для onmousemove он не видит, только сами картинки. И никакие квадраты ему не указ. Откуда он увидит дно DIV , если он не видит внутри себя ничего. привязка к body через % тоже как то не подходит.
0
|
|
|
202 / 126 / 25
Регистрация: 09.01.2022
Сообщений: 458
|
||||||
| 02.01.2024, 01:15 | ||||||
|
seregadushka,
Я решил попробовать вариант с процентами, но я сделал и сброс и всех отступы, и у меня все работает нормально! Вот код:
И наконец я решил попробовать без высоты - и удалил строка 29 - height: 50%; Вот результат - фото 2 С ширина div-a 400px - тоже работает! Вообще все работает! Попробуйте и вы тоже! Если проблема еще есть - то она исходит из скрипта! Потому что CSS работает так, как должен! В противном случае ситуация оставалась бы такой:
0
|
||||||
|
35 / 3 / 0
Регистрация: 22.08.2011
Сообщений: 172
|
|||||||||||
| 02.01.2024, 02:05 | |||||||||||
|
ivanov_333, ну прекрасно, Я понимаю. что у вас нет PNG. Я могу дать, если надо, большой размер. Я его долго чистил в Paint.Net , а потом нашелкакой-то online редактор -- типа AI -- он его за секунду отрезал фон.
Я тут и с flexbox и без него, девка привязывается (пости !) , это если удалить скриптованный корабль. Этот кораблю под скриптом выделяется из потока. И что ему ни ставь, он не хочет. У мня уже мозги кипят. Я не понимаю, у меня уже были 2 корабля со скриптами наложены. Но девка не хотела ложиться, Теперь наоборот. Девка лежит, корабль со скриптом не хочет. Я не понимаю, почему они не перевариваю вместе ? ivanov_333, у вас все слишком упрощено . Мне надо ТРИ объекта ! У вас нет ссылки вокруг картинки, мелочь, но вэтом чертов примере, ввсе важно ! Вы видите, у меня одна картинка с id="image" и ее же копия, без него. Это важно. Возможно, тут и встречются засады.
Зато если прописать просто display:flex , то девша чуть шевелится и даже попадает точно ногами в дно. Но я большой разницы не заметил, что лучше. Но сверху не ложится теперь уже ссылка <a></a>. Может надо стили ссылке писать ? Я шас соберу все, положу исходники . Там и PNG и скрипт. С этой хренью никогда не интересовался --- box-sizing: border-box; (толку отнее никогда не было) . И не хотелось бы ставить стили для *{} -- все-таки вокруг целый сайт -- как там получится -- неизвестно.
0
|
|||||||||||
|
945 / 561 / 299
Регистрация: 07.11.2022
Сообщений: 933
|
|||||||
| 02.01.2024, 02:57 | |||||||
Изменяя z-index для .image, .layer и .link можно менять положение соответствующих блоков (какой из них поверх другого). Сейчас выше всех ссылка.
0
|
|||||||
|
35 / 3 / 0
Регистрация: 22.08.2011
Сообщений: 172
|
|
| 02.01.2024, 03:14 | |
|
rr33rr, не уверен, что разбирусь. Вот с чем я работаю. Там все мелкое, картинки, могу найти оригиналы
Вот Морячка на Я.Диске. вся папка Жаль. что там нельзя протестить, но архив скачивается.
0
|
|
| 02.01.2024, 03:14 | |
|
Перевернутый текст прижать к правому краю Прижать блок к правому краю родителя Как в QRDBText прижать текст к правому краю? StringGrid: прикрепить правый край последнего столбца к краю таблицы Div прижать к правому краю внутри другого, с позицией absolute Искать еще темы с ответами Или воспользуйтесь поиском по форуму: |
|
Новые блоги и статьи
|
|||
|
Транслитерация текста с кириллицы на латиницу (вариант №3)
Maks 15.11.2026
Обновленная версия предыдущей обработки.
Изменения коснулись букв: Ъ, Ы, Ь, Э, отображения которых зависят от положения реквизита "Транслитерация имён".
Изменено отображение буквы Й.
Добавлена. . .
|
Транслитерация текста с кириллицы на латиницу (вариант №2)
Maks 13.11.2026
Обновленная версия ранее созданной обработки.
Добавлено:
- Проверка исходного текста на кириллицу, через обращение к стандартной функции "ТолькоКириллицаВСтроке" из общего модуля. . .
|
Часы с термометром и праздничным календарем
yariko 12.11.2026
Сегодня мы рассмотрим как можно сделать отличные многофункциональные часы.
Итак, поставим конкретную задачу: разработать часы с календарем, двумя термодатчиками, выводом поздравительных сообщений. . .
|
Транслитерация текста с кириллицы на латиницу (вариант №1)
Maks 11.11.2026
Решил облегчить жизнь себе и коллегам админам при создании электронных почтовых ящиков для пользователей, в результате написал обработку "Транслитерация текста" с кириллицы на латиницу, а в ней. . .
|
|
Книги по геймдизайну, левел-дизайну, игровым механикам и проектированию игрового опыта
8Observer8 08.11.2026
Содержание блога | English Version
1. 2003 - 06 - Designing Virtual Worlds (1st Edition)
Автор: Richard A. Bartle | Объем: 768 стр.
Ссылки: Amazon
. . .
|
Как только я захожу к себе в свою комнату я сразу же с себя снимаю свои трусы. Ответ от Джемени ИИ.
zorxor 08.11.2026
Джемени, как только я захожу к себе в свою комнату я сразу же с себя снимаю свои трусы.
Многие люди, возвращаясь домой, сразу переодеваются в максимально свободную одежду или вовсе предпочитают. . .
|
Паттерн очереди действий/команд (Action / Command Queue). Система очереди действий и кат-сцен с SDL3 Callbacks, cglm и OpenGL
8Observer8 07.11.2026
Содержание блога | English Version
Руководство для начинающих по реализации паттерна очереди действий/ команд (Action / Command Queue) на C++ (C++20) с использованием официального SDL3 Callbacks. . .
|
Проверка полного ФИО в типовом справочнике
Maks 07.11.2026
Решение реализовано в конфигурации КА2, на примере справочника "КонтактныеЛицаПартнеров".
Задача:
Запрет инициалов.
Не допускаеть использование сокращений вида "И. И. ", "И. И. ", "И И" и. . .
|