CSS Grid - input not respecting padding - Отличная библиотека

Я нахожу, что при использовании CSS Grid Layoutinputs не соблюдают правостороннее заполнение их содержащего элемента. В частности, виновником является атрибут css grid-template-colums.CSS Grid - input not respecting padding

Я обнаружил, что этот вопрос, компоновка сетки CSS в стороне, был разрешен с помощью приложения box-sizing: border-box. Хотя даже с этим применением и сбросом CSS я по-прежнему не могу обойти проблему.

Вот сокращенный фрагмент кода поведения моего React приложения:

http://www.webpackbin.com/VJ8DS5kOz

Вот пример его только с ванильным HTML + CSS:

https://repl.it/F75i

I Я также использую Styled Components для стилизации в моем приложении React, которое, я уверен, не способствует этому поведению, учитывая, что ванильный CSS-тест выше.

источник

2017-02-05 Jadam

Если я правильно понимаю вас, я думаю, что край - это то, что вы хотите. И я не вижу, чтобы вы применили его к полям ввода. Я добавил следующую строку в файл CSS. Делает ли это то, что вы искали?

input { margin: 5px; }

источник

2017-02-05 05:23:36 Jay

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

вы можете просто добавить маржу на правой стороне, если это все, что вы ищете. margin-right: 5px; – Jay

некоторые из моих элементов формы охватывают всю ширину и некоторые только половину. Таким образом, те, которые охватывают половину, получат дополнительные широкие желоба. Я получаю CSS Grid не полностью сфокусирован, поэтому я предполагаю, что взломы могут быть необходимы. Хотя цель состоит в том, чтобы найти более лаконичный и шаблонный способ решения проблемы, так что мне не нужно добавлять специальные классы к каждому элементу формы отдельно, а не просто применять атрибут/s к родительскому элементу. – Jadam

Вы, наверное, понял что-то, но, похоже, добавив justify-content property

justify-content: space-around;

в виде CSS делает трюк.

источник

2017-10-05 15:32:25 Jess

CSS Grid - input not respecting padding

ответ

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