#css #reactjs #fieldset
Вопрос:
Я пытался создать набор полей с помощью приложения react, но это казалось трудным, поэтому мне удалось сделать его похожим на css, и теперь мне очень любопытно, как точно так же ограничить поле comlpete
lt;div class="fieldset"gt; lt;div class="legend"gt;Textlt;/divgt; Text2 lt;/divgt;
Индивидуальные Стили:
.fieldset{ width: 200px; height: 300px; border: 1px solid black; padding: 30px; margin: 30px; position: relative; } .legend{ font-size: 45px; position: absolute; top: -8%; left: 50%; transform: translate(-50%); background: #fff; }
Комментарии:
1. Пожалуйста, покажите нам свой код, так как мы можем только догадываться, как «полная коробка» состоит из элементов(ов);
2. @AHaworth здесь!
Ответ №1:
таким образом, вы сможете приблизиться к своей цели. Надеюсь, это сработает для вас.
.fieldset{ border: 1px solid black; padding: 30px; margin: 100px 30px 30px; position: relative; font-size: 45px; width: 200px; border-radius: 10px; } .legend{ position: absolute; width: fit-content; top: -74px; left: 0; right: 0; margin: 0 auto; padding: 10px; border: 1px solid #000; border-bottom: 1px solid #fff; border-radius: 10px 10px 0 0; }
lt;div class="fieldset"gt; lt;div class="legend"gt;Titlelt;/divgt; Content lt;/divgt;