Padding не работает в Safari и IE в списке выбора
Знает ли кто-нибудь, почему мой Safari не выполняет прописку в избранных списках? Он отлично работает в FF, пожалуйста, скажите мне, что делать. есть ли проблема с doctype?
Я использую следующий doctype:
ОТВЕТЫ
Ответ 1
Несмотря на то, что спецификация W3 не запрещает заполнение в блоках выбора, по какой-либо причине браузеры веб-браузера (Safari, Chrome) не поддерживают его. Вместо этого вы можете удалить padding-left и использовать text-indent вместо этого, добавив ту же сумму в поле выбора width .
Из вашего примера в вашем комментарии:
Ответ 3
Я знаю, что это старая проблема, но, возможно, более новое решение помогает людям, работающим над этим сейчас.
Я добавил -webkit-appearance: initial; в свой стиль с дополнением, чтобы устранить проблему.
-webkit-appearance: none; не помог мне в этом случае, потому что он показывает вместо этого текстовое поле.
Safari v8.0.6 (10600.6.3) на Mac
Ответ 4
Попробуйте это, это работает для firefox, т.е. какой-то truble с дополнением, но работает с фоновым изображением. Лучшие работы в Google Chrome и Firefox. Это не работает в опере вообще, кроме дополнений. Поэтому мне все равно, что он не работает в опере или другом браузере, потому что я их ненавижу, и не все проблемы решены для работы во всех браузерах.
Просто выберите опцию 208 пикселей и поставьте ее так. У него есть некоторые элементы взлома, т.е.;)
Посмотрите в действии, как это выглядит;)
Надеюсь, вы кое-что помогли;)
Ответ 5
Я только что исследовал ту же проблему. Ответ, который я придумал, заключается в том, чтобы установить свойства границы как заполнение, но прозрачно. Например
Если вы все еще хотите использовать границу, вы можете использовать свойство контура, чтобы установить его
Ответ 6
Для конкретного окна выбора примените CSS как «-webkit-appearance: none;»
Источник
Text Padding in Select Boxes
I’ve just encountered an obscure issue with select boxes having additional space around text which doesn’t seem part of the box model. Here are two pictures of what I mean:
Here is an example of it happening (on JSFiddle) or you can view the source to my example below:
I have already worked out two methods of trying to work around it, by either having a negative text-indent or using left padding to adjust the input and select boxes to match up.
Both of these methods aren’t perfect. There is a difference between the negative text-indent for Chrome and Firefox resulting in a noticeable space if the select and input are lined up one after the other. Trying to offset the padding can make maintaining the styling of various input and select fields somewhat difficult where you are applying a percentage of padding.
I first noticed it on a client’s website where part of the word was being cut off however if that empty space was not there, the word looks like it would fit.
While I can work around this particular issue for my client (eg. wider select box, less padding), I want to know whether there is a different solution for hiding/offsetting/removing the «other» padding on the left/right of the text. Is there another CSS property I should be looking at?
I have a feeling this might just be how select boxes work but would like the collective hive of SO to prove me wrong.
Edit 1
I am hoping that the solution would be pure-CSS. I know that if I use a drop-in replacement for a select box using a JS library, it would not have the same issue.
Edit 2
Just to better clarify what I am after, the select box has an additional padding outside the box model. The pictures below show 6px for the select box and
3px for the input . I would like to either control this particular padding or remove it entirely. I have already tried with text-indent and using a padding offset to align the text in the input and select elements but both of these seem hackish. I think there is a better CSS way of doing this.
Источник
padding is not working in Safari and IE in select list
Does any one know why my Safari is not taking padding in select lists? It’s working fine in FF please tell me what to do. is there any issue with the doctype?
I’m using the following doctype;
I know it is an old problem but maybe a newer solution help people working on it now.
I added -webkit-appearance: initial; to my style with padding to fix the problem.
-webkit-appearance: none; didn’t help in my case because it shows the select as a textbox instead.
Safari v8.0.6 (10600.6.3) on Mac
I have just been researching the same problem. The answer I have come up with is to set the border properties to be the padding, but transparent. For example
If you still want to use a border, then you can use the outline property to set it
Try this this works for firefox,ie some truble with padding but works with background image. Best works in google chrome and firefox. This do not work in opera at all but padding works. So i do not care it doesn’t work in opera or other browser because i hate them and it is not porssible to fix all problems to work great in all browsers.
Just make select option 208 px image and put it like this. It has some hack elements for ie 😉
See in the action how it looks like 😉
I hope you helped some 😉
For particular select box apply CSS as «-webkit-appearance:none;»
«none» — removed caret in chrome/firefox
«initial» — made my selectboxes jumping when hovering over them in chrome
Источник
Не работает padding у option
| SDEVIL |
| ||
|
Загрузка .
| dstorm81 |
| ||
 бездельник Профиль Репутация: 3 на форуме с 8.12.2002 (http://forum.vingrad.ru/index.php?act=ST&f=10&t=4874&st=0#) | |||
|
| SDEVIL |
| ||
| Цитата(dstorm81 @ 4.12.2007, 09:51) |
| топорно |
  |  |
| Castro |
| ||
|
| SDEVIL |
| ||
| Цитата(Castro @ 5.12.2007, 01:13) |
| SDEVIL, сомневаюсь, но с другой стороны если Вы заполняете селект программно, то не думаю что это проблема. |
| | |
| Castro |
| ||||||
   |
| 0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей) | |
| 0 Пользователей: | |
| « Предыдущая тема | Вёрстка веб-сайтов | Следующая тема » |
[ Время генерации скрипта: 0.0996 ] [ Использовано запросов: 20 ] [ GZIP включён ]
Источник
