Как перезаписать CSS

Question

У меня есть форма, которая автоматически создается из SAP NW BPM. Это создает экран SAP UI5. Обычно поля могут редактироваться, но в этом случае мне не нужен пользователь для заполнения любых данных.

У меня есть элемент формы, который выглядит следующим образом.

<f:FormElement label="{i18n>DO_OrgTransord.Street}"> 
<f:fields> 
    <m:Label text="{path:'Street'}" editable="false"/> 
</f:fields> 
</f:FormElement> 

Проблема заключается в том, что метка и поля не совпадают, как это видно here.

Когда я смотрю на соответствующий element, я вижу, что элемент метки имеет стиль padding-top: 1rem ;. В IE/Edge, если я удалю это, это будет показано, как я хотел бы показать код.

Я пробовал с различными формами стиля, чтобы он выглядел лучше, но он не работает. Как я могу получить информацию на этикетке.

Answer 1

я получил вопрос неподвижный, добавив

<form:Form editable="false"> 

Это помогло решить проблему с элементами помещаются неправильно. И так как мне не нужны какие-либо входные данные, это выглядит хорошо.

Answer 2

В этом случае вы действительно должны использовать элемент ввода или текст, а не метку.

Добавляя к важному стилю CSS, он всегда будет перезаписывать CSS по умолчанию. См. !important rules at W3

Answer 3

Я нашел, что могу использовать sap.m.Test для правильного просмотра данных.

<f:FormElement label="{i18n>DO_OrgTransord.VendorName}" > 
     <f:fields> 
      <m:Text text="{path:'VendorName'}" xmlns:m="sap.m" /> 
     </f:fields> 
    </f:FormElement>