Как предотвратить прохождение границы с полевым элементом Fieldset, окруженного тегом формы? ⇐ CSS

[Anonymous]

У меня есть форма с этими тегами: , и < /code>. < /p>

Граница Fieldset проходит через середину элемента легенды. Я все еще хочу иметь границу вокруг своей формы, но я не хочу проходить через ее середину.
Проблема такова: если я попробую только в CSS только Fieldset и Legend, все работает нормально, но если я также добавлю стиль формы, я получаю ошибку, о которой я говорю. class = "Snippet-Code-CSS Lang-CSS PrettyPrint-override">

Код: Выделить всё

.form {
position: absolute;
top: 50%;
left: 50%;
-ms-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
min-height: 50px;
padding: 5px;
margin: 10px;
clear: both;
float: left;
width: 40%;
text-align: left;
border: 0px;
}
fieldset {
padding: 10px;
margin: 2px;
border: 1px solid #000000;
width: 60%;
}
legend {
padding: 0px;
border: 0px;
color: #ff0000;
text-transform: capitalize;
font-size: 14px;
font-weight: bold;
display: inline-block;
}< /code>


Title

< /code>
< /div>
< /div>
< /p>

Я думаю, это конфликт между формой и стилем Fieldset /Legend. Причина, по которой я добавил позицию: Absolute; 

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

Подробнее здесь: https://stackoverflow.com/questions/333 ... ment-surro