IE8.0.6001 Bug: background appears hidden until any element is focused

I found a bug in IE8, it's really strange. Please see example code below:

CSS:

p,h3 {
    padding:0;
    margin:0;
}
#header {
    width:900px;
    height:60px;
    background-color:#FFFF00;
    margin:0 auto;
}
#container {
    position:relative;
    width:900px;
    margin:0 auto;
    zoom:1;
}
#box_gerenciar {
    position:relative;
    width:880px;
    height:95px;
    padding:10px;
    background:url('fundo.png') no-repeat 0 0;
    margin-top:30px;
}
#box_gerenciar .foto {
    float:left;
    margin-left:6px;
    margin-top:6px;
}
#box_gerenciar .infos {
    float:left;
    margin-left:10px;
    margin-top:10px;
}
#box_gerenciar .btns {
    padding-top:10px;
    overflow:hidden;
    border:1px solid #000;
}
.btn_editar, .btn_deletar {
    float:left;
    width:150px;
    height:25px;
    background-color:#FF0000;
}

#paginas {
    float:left;
    padding-top:20px;
    position:relative;
    left:50%;
}

#paginas p {
    float:left;
    position:relative;
    right:50%;
}

#paginas a {
    float:left;
    padding:5px;
    border:1px solid #CCC;
    margin-left:7px;
}

HTML:

<div id="header">conteudo cabeçalho</div>

<div id="container">

    <div id="box_gerenciar">
        <div class="foto"><img src="teste.jpg" border="0" width="148" height="100" /></div>
        <div class="infos">
            <h3>Titulo da Mensagem</h3>
            <p>Data da Publicação</p>
            <div class="btns">
                <a href="javascript:;" class="btn_editar"></a>
                <a href="javascript:;" class="btn_deletar"></a>
            </div>
        </div>
    </div>

    <div id="box_gerenciar">
        <div class="foto"><img src="teste.jpg" border="0" width="148" height="100" /></div>
        <div class="infos">
            <h3>Titulo da Mensagem</h3>
            <p>Data da Publicação</p>
            <div class="btns">
                <a href="javascript:;" class="btn_editar"></a>
                <a href="javascript:;" class="btn_deletar"></a>
            </div>
        </div>
    </div>

    <div id="box_gerenciar">
        <div class="foto"><img src="teste.jpg" border="0" width="148" height="100" /></开发者_C百科div>
        <div class="infos">
            <h3>Titulo da Mensagem</h3>
            <p>Data da Publicação</p>
            <div class="btns">
                <a href="javascript:;" class="btn_editar"></a>
                <a href="javascript:;" class="btn_deletar"></a>
            </div>
        </div>
    </div>

    <div id="paginas">
        <p><a href="?pg=0">1</a><a href="?pg=1">2</a><a href="?pg=1">></a><a href="?pg=2">>></a></p>
    </div>

</div>

The background of #box_gerenciar appears to be hidden and then if I focus on any element in page it will appear. It's really strange. It only happens in this version of IE. I tested it in 8.0.76 and it worked fine.

Could someone help me?