CSS conflict on index

Question

I have the page below with a css:

http://hotplateprensas.com.br/gasmuriae.com.br2/

In it has a div with the classe top and inside div have 3 div's:

<div class="topo">

  <div class="topoTel" id="topoTel"><img src="_img/sgb.png" /></div>

  <div class="topoMeio" id="topoMeio"><h1><?php echo $constantes->getWwwSite(); ?></h1></div>

  <div class="topoRedesSociais" id="topoRedesSociais">
    <img class="face" src="_img/facebook.png" />
    <img class="insta" src="_img/instagram.png" />
  </div>

</div>

To save code that was like this,

 div.topo div.topoTel, 
 div.topo div.topoMeio, 
 div.topo div.topoRedesSociais {
     position:relative;
     display:inline-block;
     vertical-align:middle;
     width: 33%;
 }

did so:

 div.topo div {
     position:relative;
     display:inline-block;
     vertical-align:middle;
     width: 33%;
 }

But if you look at the web page, you’ll see that the layout from the top is messy. Looks like he’s been changed from inline-block for block the display of div's internal.

As can be seen below:

whereas the correct would be as below:

But I made a page,

http://hotplateprensas.com.br/gasmuriae.com.br2/topo.php

Only with the top part. And to my surprise, the error did not occur!

I am a long time looking for conflict and for my little experience with css, I am not finding and ask for your help.