Кнопка CSS имеет белое поле / отступы, которые не могут быть удалены - PullRequest
1 голос
/ 29 марта 2012

Я работаю над страницей, которую кто-то давно создал. Одной из вещей, которые их не волновали, был готовый дизайн кнопки для одной из кнопок на этой странице. Я вернулся в эту программу / страницу и решил, что постараюсь сделать так, чтобы она выглядела лучше, и я не могу решить эту проблему ради жизни.

Вот скрипка кнопки: http://jsfiddle.net/h5CkS/

Пустое пространство, что бы я ни делал, не исчезнет. Я не смог найти способ заполнить его, «закрасить» его span / div или чем-то еще. Если я пытаюсь настроить элемент, чтобы он был шире, или заполнить отступы, он просто перезагружает «New» в «Unvet».

Я не могу просто заполнить эту кнопку изображением из-за некоторого творческого javascript, который нацелен на комбо button-span-div.

Так что я должен как-то решить эту проблему с помощью CSS. Может ли кто-нибудь придумать, как мне избавиться от этого проклятого пробела?

Спасибо.

РЕДАКТИРОВАТЬ: Просто чтобы показать, как это разочаровывает. Я играл с Fiddle и сделал это: http://jsfiddle.net/h5CkS/6/, что выглядит идеально. Но когда я помещаю это в код страницы, я получаю это: http://i.imgur.com/PXJZi.jpg.

Ответы [ 3 ]

1 голос
/ 29 марта 2012

Я создал форк вашей скрипки - http://jsfiddle.net/GXU4w/8/ Изменения:

1) Отрицательная маржа на пролетах

2) border-width: 1px на кнопке

0 голосов
/ 29 марта 2012

Просто измените ширину .arrow-button span на 83px и добавьте height: 14px;.

0 голосов
/ 29 марта 2012
  • Установите свойство border-width для .arrow на 9px 14px.
  • Установите свойство font-size на .arrow-button на 0.
  • УстановитеСвойство width для .arrow-button span - 84px.
  • Установите для свойства font-size значение .arrow-button span - 12px или любое другое, которое кажется разумным.
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...