Пространство между двумя фоновыми изображениями

Question

Я работаю над wordpress в первый раз. И я пытаюсь добавить фоновые изображения в заголовок. Название должно выглядеть так.

До сих пор я могу достичь этого уровня.

Я хочу иметь пространство между двумя изображениями, как это сделать? Мой CSS является

.page-id-157 .widget-title{ 
height: 45px; 
padding-left:70px; 

    background-image: url('images/stripe_red_diagonal.png'),url('images/logo_outline_black.png'); 
    background-repeat: no-repeat; 
    background-position:20px 10px; 
    } 

Как дать пространство между двумя фоновыми изображениями? любая помощь будет оценена по достоинству.

Answer 1

Вам необходимо изменить значение background-position для 2-го изображения, разделенных ,

150px является горизонтальным смещением от начальной точки изображений и должны быть больше, чем размер первого изображения.

.widget-title { 
 
    height: 45px; 
 
    padding-left: 70px; 
 
    background-image: url('http://placehold.it/100x100'), url('http://placehold.it/100x100/333'); 
 
    background-repeat: no-repeat; 
 
    background-position: 20px 10px, 150px 10px; 
 
}

<div class="widget-title"></div>