Перейти из форума на сайт.

НовостиФайловые архивы
ПоискАктивные темыТоп лист
ПравилаКто в on-line?
Вход Забыли пароль? Первый раз на этом сайте? Регистрация
Компьютерный форум Ru.Board » Интернет » Web-программирование » Вопросы по CSS

Модерирует : Cheery

 Версия для печати • ПодписатьсяДобавить в закладки
Страницы: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129

Открыть новую тему     Написать ответ в эту тему

Xrobak

Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Ссылки для самостоятельного изучения:
 
Теория + примеры + учебники:
W3School: CSS Tutorial
MDN: Cascading Style Sheets (CSS)
WebReference: Уроки по HTML и CSS
htmlbook: Справочник CSS
YouTube: Основы CSS/CSS3
CSS для JavaScript-разработчика
Основы CSS - каскадные таблицы стилей
Статьи по основам CSS
 
Применение на практике:
StackOverflow: 'CSS' Questions
CSS-Tricks
 

Первый пост темы (до включения шапки).. ··· Текущий бэкап шапки..

Всего записей: 939 | Зарегистр. 16-08-2004 | Отправлено: 18:46 27-10-2004 | Исправлено: TheBarmaley, 05:24 27-02-2019
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS

Цитата:
Смайлики вставляются как шрифт, через комбинацию клавиш вызывается окошко с ними и выбирается эмодзи

окошко чье? приложения или WYSIWYG редактора?
можно извратиться и попробовать так, к примеру, но повлияет на другие span
https://jsfiddle.net/v7dbhpke/
другой вариант через  
https://jsfiddle.net/v7dbhpke/1/

Всего записей: 15686 | Зарегистр. 20-09-2014 | Отправлено: 01:23 13-06-2019
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Спасибо за ответ! Чуть позже попробую. Это в системе встроено, окошко эмодзи открывается во многих программах.

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 02:11 13-06-2019
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:
окошко эмодзи открывается во многих программах

тогда шрифт может быть другим.

Всего записей: 15686 | Зарегистр. 20-09-2014 | Отправлено: 03:48 13-06-2019
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Ещё раз спасибо за ответ! Сделал как во втором примере, всё работает, правда, строка font: 12px AppleColorEmoji тоже есть, то есть, она не заменяется.

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 12:56 13-06-2019
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:
о есть, она не заменяется.

А почему она должна заменяться?? CSS не меняет html код

Всего записей: 15686 | Зарегистр. 20-09-2014 | Отправлено: 13:00 13-06-2019
SerV2003

Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Помогите люди добрые
100dorog.su/events/zateryannyj-ostrov/
Только на смартфоне видно, что накладывается текст на сайдбар, если просто смотреть на компьютере, то выглядит всё пристойно.
Нужно поправить CSS, сам не справился.
благодарю

Всего записей: 177 | Зарегистр. 24-11-2007 | Отправлено: 15:14 13-06-2019
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
SerV2003

Цитата:
если просто смотреть на компьютере, то выглядит всё пристойно

сделайте узким окно браузера - увидите. причина в  

Код:
.mec-event-content {
    height: 150px;
}

если хотите задать хотя бы минимальную высоту, а не постоянную, используйте min-height

Всего записей: 15686 | Зарегистр. 20-09-2014 | Отправлено: 20:37 13-06-2019
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Ещё просьба подсказать по данному примеру, как можно добавить аватарки слева и справа сообщений (примерно так)? И чтобы при увеличении сообщений, аватарки оставались внизу.
Скажу сразу, поиском пробовал что-то подобное искать, не нашёл.

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 23:46 13-06-2019
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS
либо каждое облако представляет собой контейнер, в котором один элемент аватар, а второй - само сообщение с оформлением облака.
либо (если не обрезается overflow) аватар - внутри облака с абсолютным позиционированием и отрицательными left или right

Всего записей: 15686 | Зарегистр. 20-09-2014 | Отправлено: 00:23 14-06-2019
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Спасибо за совет!
В первом варианте картинка получается по левому краю серого сообщения и над ним. Если img src и текст вставить в div (контейнер).
 
Во втором варианте картинка слишком близко расположена к краю окошка чата. Это если между p class="inbox" и текстом добавить img src="". И в CSS сделать примерно так:

Код:
position: absolute;
left: -50px;
bottom: 0px;
z-index: 1;

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 01:06 14-06-2019
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS

Цитата:
Во втором варианте картинка слишком близко расположена к краю окошка чата.  

меняя координаты вы можете сдвигать насколько хочется.

Всего записей: 15686 | Зарегистр. 20-09-2014 | Отправлено: 01:08 14-06-2019
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Там же ещё padding есть, между сообщениями и левым/правым краями. Если этот отступ будет маленьким и размер окошка небольшим, то картинка будет там не в тему.
В общем-то, и картинка над сообщением выше и слева тоже вполне нормально смотрится.

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 01:24 14-06-2019
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS

Цитата:
Там же ещё padding есть, между сообщениями и левым/правым краями.  

это уже ваш выбор. вы спросили как, я сказал как.

Всего записей: 15686 | Зарегистр. 20-09-2014 | Отправлено: 01:24 14-06-2019
SerV2003

Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii благодарствую дорогой, отлично получилось.
Как вы так все находите
Еще хотел спросить, в просмотре кода Cntrl+Shift+I где видно файл исходник?
 

Всего записей: 177 | Зарегистр. 24-11-2007 | Отправлено: 09:56 14-06-2019
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
SerV2003

Цитата:
Как вы так все находите  

F12 и изучайте панель разработчика (зависит от браузера)
 

Цитата:
файл исходник

Исходник чего? Этого css стиля? Справа, а если не указано, значит он в самой странице, а не в отдельном файле.

Всего записей: 15686 | Зарегистр. 20-09-2014 | Отправлено: 12:26 14-06-2019 | Исправлено: Mavrikii, 12:29 14-06-2019
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Что-то вчера получалось, сегодня вообще запутался, не встаёт аватарка так, как надо, хоть как пробую, бесполезно. То слева как-то криво, но получается, то справа вообще никак.
Можно, пожалуйста, на примере?
 
"Чат" делал по этому примеру.

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 14:09 14-06-2019 | Исправлено: WONDROUS, 14:30 14-06-2019
webproger



Newbie
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Подробнее...

Всего записей: 23 | Зарегистр. 02-06-2019 | Отправлено: 14:59 14-06-2019
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
webproger
Спасибо за совет и пример! Но в старых браузерах, это каких?

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 16:24 14-06-2019
webproger



Newbie
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
WONDROUS
я помню в safari были проблемы, когда пытался позиционировать блок с помощью position: absolute; внутри блока с position: relative;
Выравнивание все-равно делалось относительно всей страницы до тех пор, пока не добавил родительскому блоку overflow: hidden;

Всего записей: 23 | Зарегистр. 02-06-2019 | Отправлено: 17:35 14-06-2019
WONDROUS



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
webproger
Ещё раз спасибо за ответ, работает, как и надо было.

Всего записей: 3440 | Зарегистр. 30-06-2002 | Отправлено: 18:07 14-06-2019
Открыть новую тему     Написать ответ в эту тему

Страницы: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129

Компьютерный форум Ru.Board » Интернет » Web-программирование » Вопросы по CSS


Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2024

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC

Рейтинг.ru