Как растянуть элемент на всю ширину css
Перейти к содержимому

Как растянуть элемент на всю ширину css

  • автор:

Как растянуть div на всю ширину сайта?

Можете ли вы мне подсказать как растянуть div на всю ширину сайта, width: 100% пробовал, див растянулся не на всю ширину, слева и справа были отступы. Подскажите, пожалуйста, как растянуть div абсолютно на всю ширину сайта?

Лучшие ответы ( 1 )
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
Ответы с готовыми решениями:

Как растянуть текст на всю ширину div?
Есть такой код: <div style="background-color: #00FF00; width: 100%; max-width: 800px; text-align.

Мобильное отображение сайта. Как растянуть на всю ширину
Добрый день уважаемые. Столкнулся с проблемой что не удается растянуть меню навигации на всю.

Нужно растянуть фон сайта на всю ширину и высоту
Добрый день, У меня есть фоновая картинка — что типа этого Весит мой фон 1,2 мб. У меня 2.

Как растянуть div на всю страницу внутри фиксированного div
Здравствуйте, скажите пожалуйста как можно растянуть div на всю страницу внутри фиксированного div.

367 / 405 / 165
Регистрация: 29.05.2014
Сообщений: 1,494

Лучший ответ

Сообщение было отмечено как решение

Решение

1 2 3 4
body{ margin:0; padding:0; }

87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
Помогаю со студенческими работами здесь

Как растянуть подменю на всю ширину экрана
Требуется растянуть блок с подменю на всю ширину экрана <!DOCTYPE html> <html lang="en"> .

Несколько дивов в ряд, как их растянуть на всю ширину экрана
Сайт пример, на котором пробую — http://testsite482.vacau.com/6/ Идет несколько div-ов в ряд.

Как растянуть Google карту на всю длину и ширину section
Ребят такая проблема, делаю лендинг и нужно вставить в секцию карту. Я вставляю но она не ложится в.

Как сделать фоновую картинку на всю ширину?

Для изменения размеров фоновой картинки используется свойство background-size. Значение 100% масштабирует изображение на всю доступную ширину, при этом высота будет задана автоматически, исходя из пропорций картинки (пример 1).

Пример 1. Использование background-size

Результат данного примера показан на рис. 1. Обратите внимание, что по умолчанию картинка повторяется по вертикали. Если повторение запретить через background-repeat, то фоновая картинка будет занимать лишь часть веб-страницы.

Фоновая картинка на всю ширину

Рис. 1. Фоновая картинка на всю ширину веб-страницы

Часто также требуется ограничить высоту фона фиксированным значением, а ширину оставить 100%. Для этого используем свойство height для указания высоты, а для background-size пишем значение cover (пример 2).

Пример 2. Использование background-size

Ширина фона

Домашняя акула

Результат данного примера показан на рис. 2.

Фоновая картинка на всю ширину

Рис. 2. Фоновая картинка на всю ширину элемента

См. также

  • background-size
  • Анимация ссылок при наведении
  • Масштабирование фона
  • Несколько фоновых картинок
  • Установка фона и градиента

Как растянуть элемент на всю ширину css

Покинул форум
Сообщений всего: 92
Дата рег-ции: Дек. 2009

Помог: 0 раз(а)

Вечер добрый, господа.
Снова проблемка

Нужно растянуть текст на всю ширину блока, он же div, и он же растянут на всю ширину страницы. Не знаю с какой стороны подступиться.
Вот что есть:

CODE (html):
скопировать код в буфер обмена
font-size: 77px;
font-family: tahoma, sans-serif;
font-weight: lighter;
height: 173px;
margin: 0px;
padding: 0px;
margin-top: -115px;
CODE (html):
скопировать код в буфер обмена

justify — конечно же не применим здесь. Подскажите пожалуйста в какую сторону копать?
(Добавление)
Разве что завернуть каждую букву в div или расположить в каждой ячейке одно-строчной таблицы ?
(Добавление)
Пришлось таки брать каждую букву в отдельную ячейку таблицы и растягивать ее на нужную ширину

Отправлено: 21 Декабря, 2010 — 11:04:29

Покинул форум
Сообщений всего: 18
Дата рег-ции: Нояб. 2010

Помог: 0 раз(а)

maksmib пишет:

Нужно растянуть текст на всю ширину блока

Растянуть несколько слов на всю ширину страницы или текст с многими словами?
Если первое то расстояние между буквами (например letter-spacing: 10px;), а второе текст сам растянет блок если у него нет ограничений другими элементами.
И зачем писать margin-top: -115px; по моему это дико

Отправлено: 21 Декабря, 2010 — 13:09:28

Покинул форум
Сообщений всего: 92
Дата рег-ции: Дек. 2009

Помог: 0 раз(а)

Devel Fish пишет:

Растянуть несколько слов на всю ширину страницы или текст с многими словами?
Если первое то расстояние между буквами (например letter-spacing: 10px;), а второе текст сам растянет блок если у него нет ограничений другими элементами.

Первое. Если точнее, фразу из 4х слов.
letter-spacing: 10px; не подходит ..т.к. если у пользователя 30 дюймовый экран, к примеру, у него справа от экрана останется не заполненная текстом область.

Devel Fish пишет:
И зачем писать margin-top: -115px; по моему это дико

а.. ну это задумка такая.. специальная чтобы была видна только половина текста.
Отправлено: 22 Декабря, 2010 — 10:02:32

Покинул форум
Сообщений всего: 8715
Дата рег-ции: Июнь 2009

Помог: 17 раз(а)

maksmib Для осуществления решения предполагаемой вами задачи размещения текстового содержимого на полное значение ширины контейнерного блока возможно использование следующей схемы — первоначально устанавливается минимальный и максимальный параметр расширения контейнерного блока что обеспечивает предотвращение крайнего случае расположения текстовых элеменов Кроме того за счет проведения предварительного анализа текста при генерации целевой HTML-страницы — возможно обрамление выделенных слов в контейнерные элементы и установка разделенных параметров их расширения и представления символов внутри каждого блока — что позволяет сохранить оптическую целостность слов

Как растянуть фон на всю ширину окна?

Растянуть фоновую картинку на всю ширину окна браузера с помощью CSS3.

Решение

Для масштабирования фона предназначено свойство background-size , в качестве его значения указывается 100%, тогда фон будет занимать всю ширину окна браузера. Для старых версий браузеров следует использовать специфические свойства с префиксами, как показано в примере 1.

Пример 1. Растягиваемый фон

HTML5 CSS 2.1 IE Cr Op Sa Fx

    Растягиваемый фон   

Результат данного примера показан на рис. 1.

Вид фона при уменьшенном размере окна

Рис. 1. Вид фона при уменьшенном размере окна

При увеличении размера окна браузера фон также начнёт расширяться, это приведет к ухудшению вида картинки (рис. 2).

Вид фона при увеличенном размере окна

Рис. 2. Вид фона при увеличенном размере окна

CSS по теме

Статьи по теме

  • Как изменить размер фоновой картинки через CSS3
  • Как растянуть фон на всю ширину окна?
  • Масштабирование фона

Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

Популярные рецепты

  • Как добавить картинку на веб-страницу?
  • Как добавить иконку сайта в адресную строку браузера?
  • Как добавить фоновый рисунок на веб-страницу?
  • Как сделать обтекание картинки текстом?
  • Как растянуть фон на всю ширину окна?
  • Как выровнять фотографию по центру веб-страницы?
  • Как разместить элементы списка горизонтально?
  • Как убрать подчеркивание у ссылок?
  • Как убрать маркеры в маркированном списке?
  • Как изменить расстояние между строками текста?
  • Как сделать, чтобы картинка менялась при наведении на нее курсора мыши?
  • Как открыть ссылку в новом окне?

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *