Форум программистов, компьютерный форум, киберфорум
Наши страницы
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.82/11: Рейтинг темы: голосов - 11, средняя оценка - 4.82
PriZrаK
-27 / 0 / 1
Регистрация: 28.01.2014
Сообщений: 145
1

Почему не работает свойство display со значением inline?

25.03.2015, 06:45. Просмотров 2136. Ответов 4
Метки нет (Все метки)

Например:
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <meta name="description" content="" />
    <link href="styles.css" rel="stylesheet" />
</head>
<body>
    <div></div>
    <div></div>
</body> 
</html>
CSS
1
2
3
4
5
6
div {
    width:500px;
    height:200px;
    background-color: aqua;
    display:inline-block;
}
Но с inline-block работает, почему?
0
QA
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
25.03.2015, 06:45
Ответы с готовыми решениями:

Float, display: inline-block почему?
Здравствуйте! Подскажите, пожалуйста, почему могут не работать float или display: inline-block?...

Не работает display:inline block
Дратути))0) Такая проблема.Не могу понять в чем дело.По справаот картинки должнен быть текст.По...

Display:inline/float:left не работает с дивами
Есть 3 div с картинкой и текстом. Нужно их выстроить в 3 колонки. Как это реализовать?...

Не работает display:inline-block, не встает в ряд
Почему-то не работает display:inline-block,нет,он работает,но почему &quot;header__call' не встает рядом...

Не могу понять почему блоки идут не в строку? Использовал display: inline-block
Ума не приложу почему блоки идут по вертикали? по замыслу они должны идти 2 в строку + 2 в строку...

4
Jewbacabra
Эксперт PHP
4035 / 3317 / 1429
Регистрация: 24.04.2014
Сообщений: 10,022
25.03.2015, 08:56 2
Лучший ответ Сообщение было отмечено PriZrаK как решение

Решение

PriZrаK, в чем заключается неработоспособность? width и height не могут быть применены к inline
0
Fedor92
Эксперт HTML/CSS
2934 / 2497 / 1063
Регистрация: 15.12.2012
Сообщений: 9,390
Записей в блоге: 9
25.03.2015, 11:38 3
Лучший ответ Сообщение было отмечено PriZrаK как решение

Решение

PriZrаK, потому-что если Вы задаёте блочному элементу он будет отображаться, как встроенный... А inline-block оставляет элемент блочным, но способствует его обтеканию... Иными словами задавая элементу display:inline - его размеры будут зависеть от его наполнения - даже если Вы ему задали определённые размеры, а если задать элементу display: inline-block при это указав его размеры - он никак не изменится и примет значения высоты и ширины(только появится обтекание)...
Небольшой пример:
HTML5
1
2
<div style="display:inline; width:300px; height:200px;  border:2px solid red}">Lorem ipsum</div>
<div style="display:inline-block; width:300px; height:200px;  border:2px dotted blue}"></div>
1
PriZrаK
-27 / 0 / 1
Регистрация: 28.01.2014
Сообщений: 145
25.03.2015, 15:22  [ТС] 4
Все понял, только что такое обтекание?
0
Fedor92
Эксперт HTML/CSS
2934 / 2497 / 1063
Регистрация: 15.12.2012
Сообщений: 9,390
Записей в блоге: 9
25.03.2015, 16:08 5
Лучший ответ Сообщение было отмечено PriZrаK как решение

Решение

Цитата Сообщение от PriZrаK Посмотреть сообщение
Все понял, только что такое обтекание?
К примеру у вас есть два блока(два дива)... Если использовать свойство display:inline-block, то получится что первый блок обтекает второй слева относительно второго блока, а второй блок обтекает первый справа относительно первого блока... Иными словами обтекание определяет месторасположение объектов относительно друг друга(слева или справа)... Аналогично данному свойству - свойство float
1
25.03.2015, 16:08
Answers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
25.03.2015, 16:08

Не работает свойство display
После значения list-item,маркер никак не появляется &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;style...

Не работает свойство inline-block у пунктов списка
Столкнулся с проблемой, не могу понять, как ее решить и что я сделал не правильно? &lt;div...

CSS : display: inline;
Есть ненумерованный список из изображений. Если оставить как есть то отступов между картинками нет....


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2019, vBulletin Solutions, Inc.