28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Ma page php n'est pas identique sur tous les navigateurs et suivant la résolution de l'écran.

Je m'explique:

En résolution: 1280x700, j'ai un ascenseur horizontal...c'est pas bien du tout ça mais pire encore sous IE8 je n'en ai pas du coup je ne vois pas le contenu de droite.

Sous FF 3.6.11:
upload/31871-ff1280x720.JPG

En résolution 1440x900, ça va j'ai juste les blocs "Communiquez" et "Contactez-nous" qui dépassent légèrement à droite sous ie8

Par contre sous ie7 et là c'est un big problème ça ne passe pas du tout:

upload/31871-ie71440x90.JPG

Merci d'avance pour votre aide!

Je comprends pas pourquoi mes images sont troquées sous IE7??

Tali.
Modérateur
Bon alors, il faudrait nous fournir le code HTML et CSS impliqués.

Pour les ascenseurs qui disparaîssent, je soupçonne un overflow:hidden en CSS.
Voici le corps de la page qui pose problème:

<div  style="background: #fff;height:510px;">
<table><tr>
    <td>
<div  style="background: #fff; padding: 1em;height:500px; width:593px">


    <h1 style="margin: -139px -12px 10px; background: #226284;text-align:center;color:#fff;padding:7px 16px;font-size:16px">Nos tarifs &agrave; partir du 15/10/2010</h1>

<div>
    <div  style=" float: left; height:150px;">
        <p style="font-size  : 1em; margin: -8px 0px 0px 1px">Le site d'emploi d&eacute;di&eacute; &agrave; l'int&eacute;rim</p>
        <p style="font-size  : 0.9em;">D&eacute;couvrez <strong><?=SITE_DOMAIN;?></strong> la solution<br>
         simple et efficace capable de<br>
        r&eacute;pondre &agrave; toutes vos probl&eacute;matiques<br>
        de recrutement!<br>
        Un tarif modulable<br>
        Optez d&egrave;s &agrave; pr&eacute;sent pour le meilleur tarif!</p>
    </div>
    <div style="margin-left: 15px;">
        <?php 
  
        $img_pi ='<img src="'. PUBLIC_PATH . 'images/les 2.png" width="281px" height="150px"  />';
        echo $img_pi;
      //  exit;
        ?>
    </div>

</div>

<div style=" float: left; background: url('<?= PUBLIC_PATH;?>/images/combo1.png') no-repeat; width: 130px;height: 300px;margin: -1px 20px;">
    
   <div align="center" style="margin-top: -3px; vertical-align: middle; line-height: 29px;"><b><font color="#FFFFFF" >Pack visibility</font></b></div>
    
    <div align="center" style="margin-top: 5px"><b><font size="1.5" color="#29617E" ><?php echo utf8_decode('Référencement');?></font></b></div>
    <div align="center" style="margin-top: -5px"><b><font size="1.5" color="#29617E" >+</font></b></div>
    <div align="center"  style="margin-top: -5px; margin-bottom: 24px;"><b><font size="1.5" color="#29617E" ><?php echo utf8_decode('Accès CVthèque');?></font></b></div>

    <div align="center"><font size="1" ><?php echo utf8_decode('Présentez votre agence, insérez votre logo et lien vers votre site accédez à');?><br><?php echo utf8_decode('la CVthèque');?></font></div>
    
    <div align="center" style="margin-top: 15px" ><b><font size="1" color="#29617E" ><?php echo utf8_decode('Abonnement de 3 mois');?></font></b></div>
    <div align="center"><b>179 &euro; H.T.<font size="1" color="#29617E" >/mois<sup>*</sup></font></b></div>
    <div align="center"><b><font size="1" color="#29617E" ><?php echo utf8_decode('Abonnement de 6 mois');?></font></b></div>
    <div align="center"><b>129 &euro; H.T.<font size="1" color="#29617E" >/mois<sup>*</sup></font></b></div>
    <div align="center" ><b><font size="1" color="#29617E" ><?php echo utf8_decode('Abonnement de 12 mois');?></font></b></div>
    <div align="center"><b>99 &euro; H.T.<font size="1" color="#29617E" >/mois<sup>*</sup></font></b></div></p>
   
    <!--<div style="background: url('<?= PUBLIC_PATH;?>/images/bouton.png') no-repeat; width: 100px;height: 15px; text-align: center;margin-left: auto; margin-right: auto; margin-top:1px;vertical-align:middle;">
        <b><font size="1.5" color="#FFFFFF" ><a style='color:white;text-decoration:none' href="#" onclick="">Demande de devis</a></font></b>
    </div>-->
    

</div>

<div style=" float: left; background: url('<?= PUBLIC_PATH;?>/images/combo1.png') no-repeat; width: 130px;height: 300px; margin: -1px 20px;">
    <center><b><font color="#FFFFFF" >Pack visibility <br> + 5 annonces</font></b></center>
    <div align="center" style="margin-top: 0.5px"><b><font size="1.5" color="#29617E" ><?php echo utf8_decode('Référencement');?></font></b></div>
    <div align="center" style="margin-top: -5px"><b><font size="1.5" color="#29617E" >+</font></b></div>
    <div align="center" style="margin-top: -5px"><b><font size="1.5" color="#29617E" ><?php echo utf8_decode('Accès CVthèque');?></font></b></div>
    <div align="center" style="margin-top: -5px"><b><font size="1.5" color="#29617E">+</font></b></div>
    <div align="center" style="margin-top: -5px"><b><font size="1.5" color="#29617E" >5 annonces</font></b></div>

    
    <div align="center" style="margin-top: 0px"><font size="1" ><?php echo utf8_decode('Présentez votre agence, accédez à la CVthèque');?><br><?php echo utf8_decode('en illimité, recrutez immédiatement avec 5 annonces');?></font></div>
    
  
    <div align="center" ><b><font size="1" color="#29617E" ><?php echo utf8_decode('Abonnement de 3 mois');?></font></b></div>
    <div align="center"><b>299 &euro; H.T.<font size="1" color="#29617E" >/mois<sup>*</sup></font></b></div>
    <div align="center"><b><font size="1" color="#29617E" ><?php echo utf8_decode('Abonnement de 6 mois');?></font></b></div>
    <div align="center"><b>259 &euro; H.T.<font size="1" color="#29617E" >/mois<sup>*</sup></font></b></div>
    <div align="center"><b><font size="1" color="#29617E" ><?php echo utf8_decode('Abonnement de 12 mois');?></font></b></div>
    <div align="center"><b>199 &euro; H.T.<font size="1" color="#29617E" >/mois<sup>*</sup></font></b></div>
    
    <!--<div style="background: url('<?= PUBLIC_PATH;?>/images/bouton.png') no-repeat; width: 100px;height: 15px; text-align: center;margin-left: auto; margin-right: auto; margin-top:-2px;vertical-align:middle;">
        <b><font size="1.5" color="#FFFFFF" ><a style='color:white;text-decoration:none' href="#" onclick="">Demande de devis</a></font></b>
    </div>-->

</div>

<div style=" float: left; background: url('<?= PUBLIC_PATH;?>/images/combo1.png') no-repeat; width: 130px;height: 300px;margin: -1px 20px;">
    <center><b><font color="#FFFFFF" >Pack visibility <br><?php echo utf8_decode(' + annonces illimitées');?></font></b></center>
  
    <div align="center" style="margin-top: 0.5px"><b><font size="1.5" color="#29617E" ><?php echo utf8_decode('Référencement');?></font></b></div>
    <div align="center" style="margin-top: -5px"><b><font size="1.5" color="#29617E" >+</font></b></div>
    <div align="center" style="margin-top: -5px"><b><font size="1.5" color="#29617E" ><?php echo utf8_decode('Accès CVthèque');?></font></b></div>
    <div align="center"  style="margin-top: -5px"><b><font size="1.5" color="#29617E">+</font></b></div>
    <div align="center"  style="margin-top: -5px"><b><font size="1.5" color="#29617E" ><?php echo utf8_decode('Annonces illimitées');?></font></b></div>

    <div align="center"  style="margin-top: 0px"><font size="1" ><?php echo utf8_decode('Présentez votre agence, accédez à la CVthèque');?><br><?php echo utf8_decode('en illimité, diffusez vos annonces en illimité');?></font></div>
    
 
    <div align="center" style="margin-top: 16px"><b><font size="1" color="#29617E" ><?php echo utf8_decode('Abonnement de 3 mois');?></font></b></div>
    <div align="center"><b>399 &euro; H.T.<font size="1" color="#29617E" >/mois<sup>*</sup></font></b></div>
    <div align="center"><b><font size="1" color="#29617E" ><?php echo utf8_decode('Abonnement de 6 mois');?></font></b></div>
    <div align="center"><b>359 &euro; H.T.<font size="1" color="#29617E" >/mois<sup>*</sup></font></b></div>
    <div align="center"><b><font size="1" color="#29617E" ><?php echo utf8_decode('Abonnement de 12 mois');?></font></b></div>
    <div align="center"><b>99 &euro; H.T.<font size="1" color="#29617E" >/mois<sup>*</sup></font></b></div>
    
    <!--<div style="background: url('<?= PUBLIC_PATH;?>/images/bouton.png') no-repeat; width: 100px;height: 15px;margin-left: auto; margin-right: auto; margin-top:-1px; text-align: center;vertical-align:middle;">
      <b><font size="1.5" color="#FFFFFF" ><a style='color:white;text-decoration:none' href="#" onclick="">Demande de devis</a></font></b>
    </div>-->

</div>
  

<?php

   // exit;
    ?>
</div>
</td>
<td>
<div  style="background: #fff;width:300px">
<div  style="background: #fff; padding: 1em; height:110px; width:300px">
    <h1 style="margin: -12px -26px -12px -10px; background: #226284;text-align:center;color:#fff;padding:7px 16px;font-size:16px">Communiquez</h1>

    <div align="center"  style="margin: 12px"><b><font color="#29617E" ><?php echo utf8_decode('Réservez dès à présent votre emplacement sur');?></font></b></div>

    <div align="center"><b><font color="#29617E" ><?=SITE_DOMAIN;?></font></b></div>

    <div align="center" style="margin: 2px 0px 0px"><b><font><?php echo utf8_decode('Appelez-nous au');?></font></b></div>
    <div align="center"><b><font size=3>03 67 21 19 17</font></b></div>

 </div>
 <div  style="background: #fff; padding: 1em; height:380px; width:300px">
      <h1 style="margin:  -32px -26px 10px -10px; background: #226284;text-align:center;color:#fff;padding:7px 16px;font-size:16px">Contactez-nous</h1>

    <p style="margin-left:-10px; margin-top: -10px "><font size="-1"><?php echo utf8_decode('Pour toute demande adressez-vous à:');?></font></p>
    <p style="margin-left:-10px "><img src="<?= PUBLIC_PATH;?>/images/layout/monsite.com/logo-com.png" /></p>
      
    
    <p style="margin-left:-10px "><font size="-1"><?php echo utf8_decode('(54, route de hour);?></font></p>
    <p style="margin-left:-10px "><font size="-1"></font></p>

    <p style="margin-left:-10px "><font size="-2"><?php echo utf8_decode('Pour toute information complémentaire n\'hesiter pas à nous contacter en renseignant le formulaire ci-dessous:');?></font></p>

     <form id="formTarifs" method="post" action="<?php echo $this->baseUrl(); ?>/index/tarifs2#form" name="formulaire" class="form">
    <a name="form"></a>

    <?php
    /* Messages d'erreur du formulaire*/
    echo $this->partial('index/messenger2.phtml',array(
        'prepend' => 'Le formulaire n\'a pas été envoyé, merci de vérifier les points suivant :',
        'erreurs' => $this->erreurs
    ));

  ?>
    <table style="margin-left:-10px ">
            <tr class="noprint"><td><label for="societe">Soci&eacute;t&eacute; * </label></td>
            <td>
                <?php echo $this->formulaire['societe']['element']; ?>
            </td>
        </tr>        <tr class="noprint"><td><label for="nom">Nom * </label></td>
            <td>
                <?php echo $this->formulaire['nom']['element']; ?>
            </td>
        </tr>
        <tr class="noprint"><td><label for="nom">Pr&eacute;nom </label></td>
            <td>
                <?php echo $this->formulaire['prenom']['element']; ?>
            </td>
        </tr>

        <tr class="noprint"><td><label for="email">E-mail * </label></td>
            <td>
                <?php echo $this->formulaire['email']['element']; ?>
            </td>
        </tr>

        <tr class="noprint"><td><label for="tel">Tel. * </label></td>
            <td>
                <?php echo $this->formulaire['telephone']['element']; ?><br />
    <span class="noprint">* Champs obligatoires</span>
            </td>
        </tr>
        <tr class="noprint"><td><br /><label for="message">Message * </label></td>
            <td><br />
                <?php echo $this->formulaire['message']['element']; ?>
            </td>
        </tr>
    <tr><td></td><td><?php echo $this->formulaire['submit']['element']; ?></td></tr>
    </table>
</form>

 </div>
   <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
</div>
</td>
</tr>
<!--<tr> <td>
        <div style="text-align: left; margin-left: 42px; margin-right: auto; margin-top: -293px;">
            <font size="1" color="#29617E" ><b>* +10&euro;/agence</b></font>
        </div>
    </td>
    <td></td>
</tr>-->
</table>
</div>