У меня есть два и мне нужно, чтобы оба остались центрованными как будто они были одним, я объясняюсь:
Существуют два поля, один для имени и другого для фамилии, если я вхожу например "ХУАН ДИАЗ", этот текст (что их было бы двумя input
) визуально останься сконцентрированным на контейнер желтого цвета, он не является точным, но дает внешний вид.
Проблема коренится, когда у имени или фамилии нет той же длины, как я показываю в этом изображении:
Существует способ это делать только с CSS, ориентировать текст обоих неудар в лунку как будто они были одним? Также он мог бы выбирать JS. Единственное состоит в том, что их всегда должно быть два (2) input
сориентированные. Она была бы чем-то подобным функции "сочетаться и ориентировать" Excel, только из-за того, что поместил бы пример.
Это код проблемы:
input {
border: none;
background: transparent;
text-transform: uppercase;
font-weight: bold;
width: 150px;
}
.contenedor {
background-color: gray;
width: 350px;
padding: 4rem;
}
.centrar {
background-color: yellow;
padding: 1rem;
margin: 0 auto;
text-align: center
}
.nombre {
text-align: right;
}
.apellido {
text-align: left;
}
Спасибо за Ваши наблюдения.