High-Tech Santé Médecine Droit-Finances

Auto-Entrepreneur

Comment faire ?

Rechercher : dans
Par :

Affichage site Internet depuis Outlook

Dernière réponse le 23 jui 2009 à 11:58:14 Nicolas, le 22 jui 2009 à 18:53:12 
 Signaler ce message aux modérateurs

Bonjour,

J'ai développé récemment un site Internet. Après avoir communiqué l'adresse de ce site par e-mail, mon correspondant m'a indiqué que le site ne s'affichait pas correctement sous IE7 lorsqu'il ouvrait l'url depuis Outlook 2007 (décallage du texte sur la droite). L'affichage reprend son apparence normale dès qu'il clique sur un lien. Je ne comprends pas pourquoi et je n'arrive pas à solutionner ce problème.
Pour info : le site est en php, html et css (les css ont été testées sous IE 7 et fonctionnent bien). Il n'y a pas de javascript ou de flash.

Merci d'avance pour votre aide.

Nicolas

Configuration: Mac OS X
Firefox 3.5.1

Meilleures réponses pour « Affichage site Internet depuis Outlook » dans :
Créer un site internet Voir
Déclarer son site Internet auprès de la CNIL VoirDéclarer son site Internet auprès de la CNIL Si l’objectif premier d’un site Internet est de faire connaître son entreprise, un site permet aussi d’être contacté, par des clients ou des partenaires potentiels par un système de mail ou de...
Choisir un hébergeur pour votre site Internet professionnel Voir
Protéger son site internet contre les contrefaçons VoirIl vous est sûrement déjà arrivé de craindre (ou de constater) que quelqu'un s'approprie des oeuvres que vous avez publiées (sur internet ou tout autre support) afin de mettre à son profit vos créations. Il est impossible d'empêcher des personnes...
Posez votre question Répondre

1

weetabix40, le 22 jui 2009 à 18:54:56

Salut,
As tu l'adresse du site ? | ...A consommer sans modération... | 

   
Répondre à weetabix40

2

Nicolas, le 23 jui 2009 à 09:34:44

Je ne peux pas donner l'adresse (site pro). Par contre je peux donner la structure de la page et le contenu de la feuille css correspondant :

Le problème exacte est le suivant : lors de l'ouverture de la page depuis Outlook 2007, la <div> "middle_column" vient se superposer en partie sur la <div> "left_column" alors que normalement ces 2 <div> utilisent la porpriété float:left.

Merci d'avance pour votre aide.

Nicolas

Page :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>


<title></title>

<link rel="stylesheet" type="text/css" media="screen" href="style/style.css"/> <!-- GESTION DE LA FEUILLE DE STYLE GLOBALE -->
<!--[if IE 6]-->
<link rel="stylesheet" type="text/css" href="style/style_ie.css" />
<![endif]-->
</head>

<body>
<div id="contener">
<div id="header">
<!-- affichage d'une image -->
</div>

<div id="left_column_contener">
<div id="left_column_top"></div>
<div id="left_column">
<div id="login">
<?php //AFFICHAGE DU MODULE DE LOGIN
include 'scripts/login.php';
?>
</div>
<div id="menu">
<?php //AFFICHAGE DU MENU
include 'scripts/menu.php';
?>
</div>
</div>
<div id="left_column_bottom"></div>
</div>



<div id="middle_column">
<?php //AFFICHAGE DU CORPS DE TEXTE
include 'scripts/switch.php';
?>
</div>

<div id="right_column_contener">
<div id="right_column_top"></div>
<div id="right_column">
<!-- affichage d'une image -->
</div>
<div id="right_column_bottom"></div>
</div>
</div>
<div id="footer">
<!-- affichage d'un tableau contenant une image et du texte -->
</div>
<div id="footer_bottom">
</div>
</body>

feuille de style :

body, th {
color: #0D81BE;
font-family: Arial, Helvetica, sans-serif;
font-size:0.9em;
line-height:1em;
text-align:justify;
}

body {
margin:auto;
width:1000px;
background-color: #FFFFFF;
}

img {
border:0px;
}

a, a:visited {
color: #0D81BE;
text-decoration:none;
}

a:hover{
color: #0D81BE;
text-decoration:underline;
}

/* CHOIX DE LA POLICE DES FORMULAIRES */
.input {
font-family:"Courier New", Courier, monospace;
color:#666666;
}


#contener {
width:1000px;
float:left;
background-image:url(../pictures/contener.gif);
padding:0px;
}
#header {
width:950px;
height:150px;
float:left;
margin-bottom:20px;
margin-left:25px;
}

/* CADRE CONTENANT LE MODULE DE LOGIN ET LE MENU */
#left_column_contener{
width:200px;
min-height:300px;
float:left;
margin-left:25px;
}
#left_column_top{
width:200px;
height:36px;
float:left;
background-image:url(../pictures/column_top.gif);
}
#left_column {
width:200px;
float:left;
background-image:url(../pictures/column.gif);
background-position:bottom;
background-repeat:repeat-y;

}

#login {
width:160px;
float:left;
margin-left:20px;
font-size:small;
margin-bottom:20px;
}

#login a, a:visited {
color:#666666;
text-decoration:none;
}

#login a:hover {
color:#666666;
text-decoration:underline;
}

#menu{
float:left;
width:200px;
}

#menu a, a:visited {
color:#0D81BE;
text-decoration:none;
}

#menu a:hover {
color:#0D81BE;
text-decoration:underline;
}

#left_column_bottom{
width:200px;
height:7px;
float:left;
background-image:url(../pictures/column_bottom.gif);
}



/* CADRE CONTENANT LE CORPS DU TEXTE (LISTES DES ARTICLES ET MODULES DE RECHERHCE)*/
#middle_column {
padding-left: 15px;
padding-right:15px;
position:relative;
float:left;
width:510px;
min-height:300px;
margin-right:7px;
line-height:1.2em;
}
#middle_column a, a:visited {
color:#0D81BE;
text-decoration:none;
}

#middle_column a:hover {
color:#0D81BE;
text-decoration:underline;
}

/* CADRE CONTENANT DE LA PUBLICITÉ */
#right_column_contener{
width:200px;
min-height:300px;
float:left;
}
#right_column_top{
width:200px;
height:36px;
float:left;
background-image:url(../pictures/column_top.gif);
}

#right_column {
width:200px;
float:left;
background-image:url(../pictures/column.gif);
background-position:bottom;
background-repeat:repeat-y;
}

#right_column_bottom{
width:200px;
height:7px;
float:left;
background-image:url(../pictures/column_bottom.gif);
}

#footer {
width:1000px;
color:#666666;
height:137px;
padding-top:20px;
text-align: center;
float:left;
font-size:x-small;
line-height:1em;
background-image:url(../pictures/contener.gif);
}
#footer a, a:visited {
color:#666666;
text-decoration:none;
}

#footer a:hover {
color:#666666;
text-decoration:underline;
}

#footer_bottom {
background-image:url(../pictures/footer_bottom.gif);
float:left;
width:1000px;
height:42px;
}

   
Répondre à Nicolas

3

weetabix40, le 23 jui 2009 à 11:07:45

Quelle feuille de style m'a tu donné ?
style.CSS ou style_IE.CSS ? | ...A consommer sans modération... | 

   
Répondre à weetabix40

4

weetabix40, le 23 jui 2009 à 11:31:38

Si tu appliques la propriété CSS margin à un élément de type block ayant la propriété float, alors la marge du même coté que la valeur du float, se voit multipliée par 2.
Attention cela n'est valable que pour le premier élément block de la ligne.
C'est à dire que si tu alignes 3 Balises <DIV> de suite, avec les propriétés suivantes: 

float:left
margin-left:10px;

Alors la première balise <DIV> aura une marge à gauche de 20 pixels, mais les autre se comporterons normalement...

Je pense que le problème viens de là ^^

Il te suffi d'ajouter la propriété css: 
display:inline;

Une fois cette propriété ajouté, Internet Explorer 6 se comportera normalement.
De plus cette propriété ne gênera aucun autre navigateur, car dans la norme W3C, si un élément est flotant, alors il faut ignorer sa propriété display...

A lire... | ...A consommer sans modération... | 

   
Répondre à weetabix40

5

Nicolas, le 23 jui 2009 à 11:40:36

Je t'ai donné style.css. Le bug se produit sur IE7. Normalement la feuille style_ie.css n'est prise en compte que pour IE6 et les versions antérieures (Si je me suis pas planté). Je n'ai pas pu tester sur les autres IE mais par contre je sais qu'il n'y a pas de problème si j'ouvre la page depuis Outlook dans Google Chrome.
J'ai également fait des test sur Mac en utilisant "Mail" et je n'ai eu aucun problème d'ouverture dans Safari et Firefox.

   
Répondre à Nicolas

6

weetabix40, le 23 jui 2009 à 11:48:57

/* QUELLE MERDE CET IE _ON*/
Essayes de voir avec ma réponse #4
Je pense que le problème viens réellement de là.
/* QUELLE MERDE CET IE _OFF*/ | ...A consommer sans modération... | 

   
Répondre à weetabix40

7

Nicolas, le 23 jui 2009 à 11:51:15

Merci pour cette explication mais ça ne règle pas le problème avec IE 7. J'ai trouvé un moyen d'y pallier en faisant un rafraîchissement automatique de la page lors de la connexion au site avec une balise <META> que je mets une seule fois dans le code (elle n'apparaît plus après afin de ne pas avoir un rafraîchissement périodique). Cela fera l'affaire mais c'est un peu moche et j'aurais aimé trouvé d'où vient le problème.

   
Répondre à Nicolas

8

Nicolas, le 23 jui 2009 à 11:56:00

PS: j'ai peut-être oublié de préciser que dès que je clique sur un lien du menu pour changer de page ou que je rafraîchit tout simplement la page avec F5, le problème d'affichage disparaît et ne réapparaît plus pendant la navigation. Bref c'est encore une belle blague de Micro$oft tout ça :(

   
Répondre à Nicolas

9

 weetabix40, le 23 jui 2009 à 11:58:14

A ouais carrément ^^
Microsoft ferais mieux de se contenter a bien faire ses OS et rien de plus. | ...A consommer sans modération... | 

   
Répondre à weetabix40
Posez votre question Répondre
Ils ont besoin de votre aide