Vanco
Vanco

Reputation: 558

Equivalent of width:-moz-available in Google Chrome

Is there an alternate way to fill the available space of nested divs in Google Chrome? Firefox's -moz-available does just that, but takes margins, paddings and scrollbars into consideration. There is no -webkit-available, though.

Upvotes: 16

Views: 18142

Answers (3)

ilgam
ilgam

Reputation: 4430

Try this.

elem {
  width: 100%;
  width: -moz-available;          /* For Mozzila */
  width: -webkit-fill-available;  /* For Chrome */
  width: stretch;                 /* Unprefixed */
}

Upvotes: 30

greim
greim

Reputation: 9437

What about this?

box-sizing: border-box;

Upvotes: 11

Marek Ka.
Marek Ka.

Reputation: 337

-moz-available = container width - (margin + border + padding) so try width: intrinsic;.

Upvotes: -2

Related Questions