- Поисковые системы
- Практика оптимизации
- Трафик для сайтов
- Монетизация сайтов
- Сайтостроение
- Социальный Маркетинг
- Общение профессионалов
- Биржа и продажа
- Финансовые объявления
- Работа на постоянной основе
- Сайты - покупка, продажа
- Соцсети: страницы, группы, приложения
- Сайты без доменов
- Трафик, тизерная и баннерная реклама
- Продажа, оценка, регистрация доменов
- Ссылки - обмен, покупка, продажа
- Программы и скрипты
- Размещение статей
- Инфопродукты
- Прочие цифровые товары
- Работа и услуги для вебмастера
- Оптимизация, продвижение и аудит
- Ведение рекламных кампаний
- Услуги в области SMM
- Программирование
- Администрирование серверов и сайтов
- Прокси, ВПН, анонимайзеры, IP
- Платное обучение, вебинары
- Регистрация в каталогах
- Копирайтинг, переводы
- Дизайн
- Usability: консультации и аудит
- Изготовление сайтов
- Наполнение сайтов
- Прочие услуги
- Не про работу
Переиграть и победить: как анализировать конкурентов для продвижения сайта
С помощью Ahrefs
Александр Шестаков
Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий
Добрый день.
Есть текст заключенный в span
В css этому спану прописываю background: bkack; padding: 4px;
Текст не умещается в одну строку, поэтому я добавил паддинг, чтобы залить бэкграундом промежутки между строк. И чтобы было расстояние с фоном от края заливки до начала текста слева и справа.
Вероятно есть другое более правильное решение, т.к. мой вариант приводит к тому что с новой строки текст снова прилепает к краю игнорируя паддинг.
Пробовал display: block; - не вариант, т.к. в таком случае бэкграунд заливает весь див целиком, в котором находится спан. А мне надо чтобы заливка заканчивалась там где закончился текст на строке.
Гуглил, нашел два подобных вопроса на других форумах оставшихся без ответа.
Может быть на нашем форуме найдется решение?
Походу никак и не сделать. А зачем вам это надо? Вставляйте в span каждую строку как вариант.
Tempter, попробуйте display: inline-block;
Tempter, попробуйте display: inline-block;
Не, я пробовал, не работает 🤪
Tempter, попробуйте display: inline-block;
Не, я пробовал, не работает 🤪
Ага, не работает ((( грусть-печаль прям какая-то, дизайнер нарисовал, макет утвердили, как сверстать не знаю )))
Обернуть каждое слово в [ ] пробелы с двух сторон, тогда в месте переноса будет отступ с цветом фона.
Заверните спан в див блок, задайте диву ширину. Регулируя ширину блока возможно исправите или я не правильно понял. Ах да в css после каждого значения перед точкой с запятой поставьте !important
Обернуть каждое слово в [ ] пробелы с двух сторон, тогда в месте переноса будет отступ с цветом фона.
Что-то мне подсказывает что такое решение какие-то костыли )) Помоему должно быть другое решение.
Но если я его не найду, придется сделать как вы сказали.
Спасибо!
---------- Добавлено 20.06.2015 в 23:42 ----------
Заверните спан в див блок, задайте диву ширину. Регулируя ширину блока возможно исправите или я не правильно понял. Ах да в css после каждого значения перед точкой с запятой поставьте !important
Вы на самом деле не правильно поняли.
Фон должен быть только за текстом, т.е. на каждой строке текста ширина фона разная в зависимости от кол-ва слов в строке.
Если начать работать с дивом, фон будет по всему диву.
Если вы предлагаете каждую строку в див завернуть - не подходит, т.к. при изменении размера окна, строки уменьшаются и увеличиваются.
Что-то мне подсказывает что такое решение какие-то костыли )) Помоему должно быть другое решение.
Но если я его не найду, придется сделать как вы сказали.
Спасибо!
---------- Добавлено 20.06.2015 в 23:42 ----------
Вы на самом деле не правильно поняли.
Фон должен быть только за текстом, т.е. на каждой строке текста ширина фона разная в зависимости от кол-ва слов в строке.
Если начать работать с дивом, фон будет по всему диву.
Если вы предлагаете каждую строку в див завернуть - не подходит, т.к. при изменении размера окна, строки уменьшаются и увеличиваются.
ну тогда добавьте padding-left:***px!important; и padding-right:**px!important; margin:0px auto!important; Если это не поможет то в css пропишите text-align: justify;
**px - замените на значения
Tempter, сделайте уже онлайн-демку что-там-у-Вас-есть и запостите ссылку)
В css этому спану прописываю background: bkack; padding: 4px;
Текст не умещается в одну строку, поэтому я добавил паддинг, чтобы залить бэкграундом промежутки между строк. И чтобы было расстояние с фоном от края заливки до начала текста слева и справа.
Вероятно есть другое более правильное решение, т.к. мой вариант приводит к тому что с новой строки текст снова прилепает к краю игнорируя паддинг.
Пробовал display: block; - не вариант, т.к. в таком случае бэкграунд заливает весь див целиком, в котором находится спан. А мне надо чтобы заливка заканчивалась там где закончился текст на строке.
Гуглил, нашел два подобных вопроса на других форумах оставшихся без ответа.
Может быть на нашем форуме найдется решение?
а мы сидим все такие, и в уме рендерим вашу хтмлку :)