Почему блок растянут на всё пространство своего родительского блока?

Question

[Андрей Галко]

И как придать блоку длину, которая будет зависеть от контента в блоке?
Дополню: в родительском два элемента, и ширина блоков почему-то зависит от первого блока, в котором текст.

/* texts - Родительский для двух последующих*/
.texts {
	display: block;
	position: fixed;
	top: 45%;
	left: 2%;
}
.maintext {
	background: #fff;
	padding: 7px;
	font-family: Helvetica;
	font-weight: bold;
	font-size: 200%;
}
.secondtext {
	background: #fff;
	padding: 7px;
	font-family: Helvetica;
	font-weight: bold;
	font-size: 200%;
}

<div class="texts">

	<div class="maintext">Типо длинный текст!</div>
	<div class="secondtext">Текст короче</div>
</div>

Answer 1

[Слава]

Потому что у div по умолчанию свойство display равно block
Что сообщает элементу - надо растянуться по размеру родителя.

Поставьте display: inline-block;
И тогда div будет тянутся по содержимому

Comments

[Sherlock19]

2 нижних блока, все равно располагаются ниже контейнера. Я не пойму что на них влияет... Я боюсь двигать их позишенами, тк опасаюсь кривого отображения при масшабировании браузеров.