'display: inline block' trick not working in firefox

what I am trying to create is a full page website (no scrollbar) with a block of text/images/divs that centres both vertically and horizontally. I have researched and used a technique using a 100% height div with 0px width and then a content div to vertically centre content. Works perfect in safari, not at all in firefox (horizontal works in both browsers.) block of code used for this below... html- ``` body <div class="block"> <div class="centered"> ... content and images </div> </div> ``` css- ``` html, body {height: 100%;} .block { background: url(images/bgimage.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; min-height: 100%; margin: 0px; } .block:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; padding: 0px; margin: 0px; } .centered { display: inline-block; vertical-align: middle; padding:0px; margin: 0px; text-align: center; *display:inline; } ``` is there some equivalent to "display: inline-block" i can use for firefox? I can't use 'float:left' cause it won't vertically center the content div, and screws up the inline block statement. All help welcome - Cheers