Встроенные отображаемые блоки в IE образуют одно слово
Проблема в том, что у меня есть несколько тегов «h2» с атрибутом display:inline, а в замечательных браузерах Microsoft пространство между ними не появляется. Есть ли обходной путь?
Я знаю, что в HTML есть "неразрывный пробел" , но мне было интересно, можно ли сделать пробел, который может быть "нарушающим пробелом".
--- редактировать ---
Веб-сайт - http://newstoday.ro, а поведение указано в нижнем колонтитуле. Если сайт открыт в IE, список будет непрерывным, даже если между словами есть пробел. Пожалуйста, не комментируйте остальную часть кода, так как я просто сантехник в этой ситуации. Также обязательно должны быть заголовки, так как клиент считает, что это лучше для SEO.
Ответы 7
Вы можете просто использовать обычное пространство, но добавить «margin-right: _ px» в определение h2 css, чтобы настроить интервал между тегами. Допускаются и отрицательные значения.
Ну, тормозное пространство - это просто пробел, вы знаете "" без кавычек ...
Вы пробовали установить свойство "маржа"? Не уверен, что это напрямую относится к вашему вопросу.
Бросив & nbsp; там, кажется, создается пространство:
<html>
<head><title>Blah</title></head>
<body>
<h2 style = "display:inline;">Something</h2>
<h2 style = "display:inline;">Something Else</h2>
</body>
</html>
В этом примере у вас фактически получается два пробела, поэтому вы можете удалить пробелы между тегами и & nbsp; если вам нужен только один пробел. Другой вариант - добавить левое / правое поле к элементу заголовка.
Примените стиль margin: 0 0.5em к обоим заголовкам - отрегулируйте 0,5 в соответствии с требованиями (возможно, 0,25 или 0,75 лучше; также первый 0 - это верхнее / нижнее поле, отрегулируйте при необходимости).
Примечание. Поскольку вам нужен символьный пробел, вам нужен em, а не px, как предлагалось ранее.
Полный пример кода ...
<!DOCTYPE html>
<html>
<head>
<meta http-equiv = "Content-Type" content = "text/html;charset=utf-8"/>
<title>Inline Header Example</title>
<style type = "text/css">
h2
{
display: inline;
margin: 0 0.5em;
}
</style>
</head>
<body>
<h2>First Header</h2>
<h2>Second Header</h2>
</body>
</html>
Хм!? Я перечитывал его вопрос несколько раз, и определенно кажется, что он спрашивает о промежутке между несколькими H2, а не о тексте, перетекающем с H2. Обычный текст будет делать это по умолчанию.
Ответ в том, что это невозможно. Вы имеете в виду, что вы хотите, чтобы текст, находящийся в большом блоке текста, плавно перемещался так же, как и остальная часть, как если бы тег был <strong> вместо <h2>
Поскольку h2 является элементом уровня блока, независимо от того, как вы его стилизуете, некоторые браузеры (кашель) будут подавлять вашу попытку передать его в строку с другим текстом.
Это неправильно: «Так как h2 - это элемент уровня блока, независимо от того, как вы его стилизуете» H2 с display: inline перестанет быть элементом уровня блока. Если вы поместите встроенный H2 в обычный текст, будет (по умолчанию) разница в размере шрифта, но это не помешает ему течь.
См. Эту статью: Уровень элементов autisticcuckoo.net/archive.php?id=2005/01/11/block-vs-inline -1 определяется DTD, а не CSS. Как я уже сказал, указание того, что элемент уровня блока должен создавать встроенный блок, не меняет того факта, что это элемент уровня блока.
Я не могу придумать объяснения, почему вы хотите, чтобы h2 отображался встроенным. В самом деле, зачем вам нужно, чтобы два заголовка читались вместе? Подумайте, как это следует читать. Вы хотите прочитать:
"Заголовок один, заголовок два"
или же:
"Заголовок один"
"Заголовок два"
Если это первый способ, то, вероятно, ваш HTML испорчен. Если это второй, то вам, вероятно, следует подумать о его позиционировании, а не об изменении его поведения, и использовать другие методы css, такие как float и position.
Это хороший вопрос. Если есть два заголовка, должны ли они быть оба h2s, или это должны быть h1 h2 или h2 h3. Подумайте, как он читается вслух, - это хороший способ подумать о структуре.
Мой клиент хочет Tagcloud, но настаивает на том, чтобы ссылки были обернуты в H2.
это не отвечает на вопрос спрашивающего. Он спрашивает, как сделать текст внутри тега похожим на настоящий встроенный тег.