Question

Consieder the following please:

.d1 {
width: 100px;
float: left;
}

.d2 {
width: auto;
float: left;
}

<div class="d1">Content fixed</div>
<div class="d2">This content should take the rest of the page (on vertical side)</div>

This does not work.
How can I let a fixed width div stay on the left of a variable (window adaptive) width div?

Thank you.

Answer 1

Removing the float from .d2 and giving it a left padding equivalent to .d1‘s width will do the trick:

.d1 {
    float: left;
    width: 100px;
}

.d2 {
    padding-left: 100px;
}

You can see it in action here.