Почему svg картинка не принимает размеры родительского блока?

Question

[antonio0226]

Привет всем.
Есть вот такая html структура

<div class="col-md-3">
					<div class="red__block_wrapper">
						<div class="red__block">
							<div class="red__block__logo"></div>
						</div>
					</div>
				</div>

И css стили

.red__block_wrapper{
	background: #ad000b;
}
.red__block{
	height: 250px;
	width: 250px;

}
.red__block__logo{
	background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21000 29700" fill="#ad000b"><defs><style type="text/css">@font-face { font-family:&quot;Antiqua&quot;;font-variant:normal;font-style:normal;font-weight:normal;src:url(&quot;#FontID0&quot;) format(svg)}.fil0 {fill:#fffff5}.fnt1 {font-weight:normal;font-size:1180.53px;font-family:&#39;Antiqua&#39;}.fnt0 {font-weight:normal;font-size:1697.53px;font-family:&#39;Antiqua&#39;}</style></defs><text x="3718" y="12057" class="fnt0">Текст</text><text x="3662" y="14610" class="fnt1">  Текст</text><text x="3662" y="15925" class="fnt1">Текст</text><rect x="964" y="10083"/><polygon class="fil0" points="3096 13465 3039 13773 3340 14105 3126 15584 3214 16254 2264 13615 "/><polygon class="fil0" points="2027 14957 2184 14668 2373 14969 "/><path class="fil0" d="M3438 10501c-156-48-148-11-263-31-8-1 33 78 25 77-8-1-63-35-72-36-7-1 21 46 12 46-170-7-557 145-635 290-96 179-84 427-84 562 51 19 58 183 40 228 1-36-10-87-31-134-17-40-108-97-100 206 2 75 50 200 58 257 31 237 54 185 114 174-2 146 65 455 65 455 18 113 438 399 629 475 191 76 292 60 292 60l-51-2628z"/></svg>');
	background-repeat: no-repeat;
}

Такая проблема, что блок с картинкой, не принимает размеры родительского блока => картинка не отображается. Хотя до этого указывал blockname в него пихал блок которому инлайном задавал background , как здесь, и картинка корректно отображалась. Заранее спасибо. Если даю высоту картинки, то она растягивает всю страницу т.е сам блок становиться например 250px, но картинка намного меньше.

Comments

[Максим Тимофеев]

картинка на background не может растягивать блок.

[Ankhena]

1. где размеры у .red__block__logo?
2. где background-size?

[antonio0226]

Ankhena,
Если задаю размеры, увеличивается блок и картинка идет ниже. Мне нужно что бы она была где с синий маркер.

[Ankhena]

antonio0226,

Если задаю размеры, увеличивается блок и картинка идет ниже.

Это вот вообще не понятно.

Спозиционируйте ее туда, через bg position или весь блок через просто position или transform, что больше подходит. Попробуйте задавать блоку размеры ровно по размеру картинки.

А вообще либо дают ссылку либо выкладывают код в песочницу типа jsfiddle.
По скрину кажется, что количество div'ов можно сохранить.