Mateusz Rogulski
Mateusz Rogulski

Reputation: 7455

Fill height of absolute positioning children

I have the following problem: I need to display informations in 2 columns first column should have static width, and second column should fill width to the resolution of page.

Here is my solution for this, but it doesn't work completely correct. I have used box-sizing: border-box and position: absolute for this but with this parent of the record ignore height of the absolute positioning children.

I need to show all the content of each column. I also have some restrictions: solution should be compatible with IE9 so I cannot use flexbox.

Upvotes: 1

Views: 78

Answers (2)

DaniP
DaniP

Reputation: 38262

You can have two compatible solutions here:

Upvotes: 0

Ty Bailey
Ty Bailey

Reputation: 2432

Try setting the parent element to display: table; width: 100%; and the columns display: table-cell; and a width for the fixed width column. This will set your fixed column to a specific width and then use the other column to fill the rest.

Upvotes: 1

Related Questions