responsive design - Use rems in Facebook Page Plugin -

i want set page plugin on website display nicely on screens variety of resolutions , pixel densities. in order achieve that, i'd have have possibility use rems in data-width attribute. unfortunately, when enter rem value, data-width attribute ignored. there way make plugin behave nicely rems?

to make facebook page plugin responsive on initial page load, instead of using rems, you'll want remove data-width attribute , instead add

data-adapt-container-width="true"

this make facebook page plugin responsive, on initial page render, minimum width of 180px.

i'm still trying figure out how make dynamically responsive, in spite of facebook's caveat (i'll post update if ever find answer).

no dynamic resizing

the page plugin works responsive, fluid , static layouts. can use media queries or other methods set width of parent element, yet:

the plugin determine width on page load. not react changes box model after page load. if want adjust plugin's width on window resize, manually need rerender plugin.

source: https://developers.facebook.com/docs/plugins/page-plugin

you make dynamically responsive reinitializing widget on browser resize, doing run risk of eating memory quickly.

there other stuff can try here responsive width facebook page plugin