Верстка HTML/CSS Проблема с добавлением картинки через свойство background

Не могу понять почему здесь не работает картинка:
Это код картинки с набором стилей

 .lm {
    margin: 40px auto;
    background: url('../img/lm.png')0 0/100% 100% no-repeat;
    max-height: 320px;
    height: 100%;
    max-width: 500px;
    width: 100%;
    border: 8px solid white;
    box-shadow: 0.2px 0.2px 10px 0.2px;

} 

Это контейнер в который помещена картинка:

 .container {
    width: 100%;
    max-width: 600px;
    margin: 100px auto;
    border: 1px solid black;

} 

Результат:

Картинка не появилась в полный рост , а просто выбилась полоска картинки в ширину
Но как только я добавляю в контейнер высоту

 .container { 
    width: 100%; 
    max-width: 600px; 
    margin: 100px auto; 
    border: 1px solid black; 
    height: 1000px; 
 
} 

Картинка появляется

Так же у меня есть такие картинки в виде галочек

Они так же лежат в контейнере , но уже в другом:

 .container_text {
    border: 1px solid black;
    margin: 0px auto;
    width: 100%;
    max-width: 450px;
} 

И вот код картинок галочек:

 .galka li {
    margin-bottom: 10px;
    padding: 0px 0px 0px 15px;
    background: url("../img/131.png")left/10px 10px no-repeat;
} 

Как видите в случает с галочками проблем не возникло я не добавлял высоту в контейнер и изображения появились. Я не понимаю в чем проблема и для меня эти два случая идентичны.
Помогите разобраться что не так и как сделать так что бы мне не приходилось вписывать в контейнер высоту я хочу что бы при добавлении контента страница произвольно увеличивалась сама а не задавать ей фиксированную ширину.
Заранее спасибо