Как адаптировать блок?

Question

[Антон]

Здравствуйте! Помогите пожалуйста решить проблему, имею блок, который в свою очередь разделен еще на два, как мне сделать так, что бы при уменьшении размера экрана, блоки не съезжали, а основной блок уменьшался вместе с его содержимым, при этом сохраняя пропорции!?
HTML код:

<div class="myprof">
    <div class="prof-left">
        <img src="http://placehold.it/450/&text=+LOGO" alt="">
    </div>
    <div class="prof-right">
        
    </div>
</div>

CSS код:

.myprof {
    max-width: 100%;
    padding: 10px;
    background: #fff;
    border: 1px solid #333;
    border-radius: 3px;
    margin: 0 53px 73px 53px;
}
.prof-left {
    display: inline-block;
    vertical-align: top;
}
.prof-right {
    width: 930px;
    height: 450px;
    margin-left: 7px;
    vertical-align: top;
    border: 1px solid blue;
    display: inline-block;
}

Answer 1

[lodas]

Для .prof-left и .prof-right ставьте ширину в процентах, т.е. например .prof-left {width:30%;} и .prof-right {width:70%;}. Подобрать процентное соотношение можно на максимально возможной ширине главного блока.