Float a div without defining height property

Question

It looks very simple (and maybe is, just got stucked) -> just for fun, no practical need right now.

I got this:

Answer 1

You will need to use display:table on the container and display:table-cell on the children:

FIDDLE

CSS:

.master {
    width: 100%;
    height: 100%;
    display:table;
}
.left {
    background: red;
    display:table-cell;
    width:10%;
}
.left p {
    padding: 5px;
    color: #fff;
    text-align: center;
}
.right {
    border-left: 10px solid #fff;
    background: blue;
    color: #FFF;
    display:table-cell;
}
.right p {
    padding: 0px 15px 0px 15px;
    text-align: justify
}