 <p>Absolutely positioned elements are removed from the normal document flow, so they won't fill up 100% of their parent like regular static block level elements. Instead, they rely on their content width or a specified width. Firefox seems to apply the content width a bit differently than Chrome or IE, which is why it appears cut off.</p> <p>Not sure of your use-case or what browsers you support, but you have a couple options: </p> <ol> <li>Set a width on the absolutely positioned element</li> <li>If you don't need to <a href="http://caniuse.com/#search=flex" rel="nofollow">support &lt; IE 10 or opera mini</a>, you can <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Flexible_boxes" rel="nofollow">use flexbox instead</a> of the media object</li> <li>If you just don't want the text cut off, you can use the newer <a href="https://github.com/stubbornella/oocss/blob/master/oocss/src/components/media/_media.scss" rel="nofollow">OOCSS method for media objects</a> which uses <code>display: table-cell</code> for media body. This has the caveat that your media object basically take up as much room as it can since it behaves like a table cell, which may not be what you're after.</li> </ol>