2014-01-07 3 views
-4

Пробелы добавляются ПОСЛЕ привязанных тегов, и я не знаю почему. Я читал, что это можно использовать, вызванное значениями ширины в процентах, но я не использую никаких для рассматриваемого элемента div. Разве это не может быть вызвано родительским стилем элементов?CSS Нежелательные пробелы, добавленные после тега привязки

Whitespace error http://imageupper.com/s02/1/2/B13890541672052617_1.png

Обратите внимание на пробел после "события" ссылку. Это происходит на каждом ярлыке привязки на моем сайте.

Любые идеи о том, как их решить, будут оценены.

HTML

<a href="/events/">Events</a> 

CSS

a { 
    color:#000; 
    text-decoration:underline; 
} 
a:hover { 
    color:#000; 
    background:#ff6600; 
    text-decoration:none; 
} 
#content { 
    width:800px; 
    margin:0 auto; 
    padding:15px 10px 10px 15px; 
} 

Без добавления кода всей моего сайта; приведенный выше код является лучшим, что я могу предложить. Хотя, я уверен, что этот конкретный код не является виновником.

Когда я копирую и вставляю последние несколько слов в текстовый редактор; появляется только одно пространство, как и должно быть.

+0

Можете ли вы добавить свой html и css? может быть jsfiddle? – Siva

+5

Вы должны показать нам свой HTML и CSS, в своем посте, а также в [jsFiddle] (http://jsfiddle.net/) или что-то подобное. Не предоставление этого просит нас помочь с завязанными глазами. – Ming

+0

Может быть любое количество преступников. Вам нужно будет предоставить соответствующий фрагмент кода, чтобы люди могли точно определить причину. – Boaz

ответ

0

1) Проверьте свой CSS. Где-то внутри:

a:link { ... } 
a:visited { ... } 
a:hover { ... } 
a:active { ... } 

ИЛИ

a.someClassName { 
    padding-right: 16px; 
    background: url(pix/ext_link_14x14.png) no-repeat right; 
} 

там может быть

padding-right: 16px; 

или что-то подобное.

Проверьте все таблицы стилей, включенные в эту страницу. Другая таблица стилей может переопределить ту, которую вы предоставили.

2) Попробуйте сделать некоторые «отладки». Например, используйте Firebug Add-on для Firefox, перейдите на вкладку HTML и наведите указатель мыши на этот тег (в части кода). Он будет подсвечен (на странице) разными цветами, в зависимости от того, был ли это запас, заполнение и т. Д. Я просто двигаю мышью над кодом, и он выделяет тег с пробелами вокруг него разными цветами. Это может помочь получить представление о том, какое ключевое слово можно найти в таблице стилей.

3) Попробуйте отключить все наследуемые стили CSS для тега «a». Например, поместите этот кусок кода в HTML страницу:

<style type="text/css"> 
a { 
    padding: 0px; 
    margin: 0px; 
} 
</style> 

4) Если вы используете DHTML, JavaScript, JQuery OnLoad событие - временно отключить. Если пробелы возвращаются в нормальное состояние, то мы точно знаем, что проблема находится в области JavaScript. Отлаживайте JavaScript шаг за шагом, чтобы найти точное место, где отступы (или другое свойство) установлены в тег «a».

+0

За исключением таблицы стилей библиотеки jQuery, у меня есть только одна таблица стилей, используемая на всем моем сайте, а таблицы стилей jQuery никогда не мешали моему CSS. – JustSomeGuy

+1

@JustSomeGuy Как вы попытались отладить это? В большинстве современных браузеров есть отладчик css. – Daedalus

3

Это может быть страшно Inline-block Whitespace Problem?

Проверьте свои таблицы стилей что-то вроде этого:

a { 
    inline-block; 
} 

ИЛИ

.example { 
    display: inline-block; 
} 

Если вы обнаружили, что, попытайтесь удалить или изменить тип дисплея.

+0

встроенный блок работал отлично для меня! –

Смежные вопросы