Make DIV occupy remainder of the page with CSS

Question

Make DIV occupy remainder of the page with CSS

Navigation

#1 by (2 votes)

3

Good people, I have a div#x that varies its width between 70px ~ 220px . I need a second div#y , which is by your side to occupy the rest of the page space.

With jQuery it would be something like: $('#y).width() = 100% - $('#x).width(); .

Does anyone know how to do this in CSS ?

css css3 div

asked by anonymous 18.12.2014 / 01:54

1 answer

How to copy a database from SQLiteStudio to eclipse? Synchronize Threads

score 2 · Accepted Answer

You can use display:table and display:table-cell to be able to manipulate as you want.

Example:

.principal {
    width:100%;
    display:table;
}

.principal div{    
    display:table-cell;
    height:200px;
}

.principal div:first-child{background:red;width:200px;}
.principal div:last-child{background:green;}

<div class='principal'>
    <div></div>
    <div></div>
</div>

In JSFiddle: link