Как я могу установить содержание ролевого заголовка реакции в центре? - PullRequest
0 голосов
/ 08 февраля 2019

Я использую реагирующий ремень Modal, есть ModalHeader, где я показываю свой контент. Но я сталкиваюсь с проблемой, когда пытаюсь поместить этот контент в центр заголовка.

После проверкиэлементы, которые я обнаружил внутри ModalHeader, есть тег <h5>, внутри этого тега идет мое содержимое, я проверил, что тег <h5> не использует всю ширину Modal-Header. Я думаю, что из-за этого он не идет по центру.Если кто-то знает о реагирующем ремне Модал, пожалуйста, подскажите, как я могу поместить содержимое моего Модального заголовка в центр. Заранее спасибо.

Вот мой пример кода.

<ModalHeader toggle={props.toggle} > 
<div className="d-flex justify-content-center mb-2">
 <img src={myImg} alt="img" className="imgSize" /> 
</div> 
<div className="d-flex justify-content-center"> 
<p>Hi <b>John -</b> here is my some text</p>
</div> 
</ModalHeader>

1 Ответ

0 голосов
/ 08 февраля 2019

Вы можете добавить className к тегу h2 с помощью реквизита cssModule.Добавление w-100 text-center решит проблему для меня

<ModalHeader toggle={props.toggle}  cssModule={{'modal-title': 'w-100 text-center'}}> 
<div className="d-flex justify-content-center mb-2">
 <img src={myImg} alt="img" className="imgSize" /> 
</div> 
<div className="d-flex justify-content-center"> 
<p>Hi <b>John -</b> here is my some text</p>
</div> 
</ModalHeader>
...