problèmes d'affichage sous IE

Cristofgeorges · 20/02/2010 15:11:51

Bonjour,

Je ne parviens pas à résoudre un souci d'affichage sous Internet Explorer (pas de souci avec les autres navigateurs) :
- la partie "main" est décalée en dessous, et, moins grave, tout est "scotché" à gauche...
- idem avec Opera, sans le retour vers la gauche, certes, mais la partie "main" est "en dessous" également...

L'adresse du site :
http://maisonperieux.org

j'ai essayé de changer les float et les widht, rien n'y fait...

Si quelqu'un a une idée et/ou la solution, merci d'avance pour le temps passé.

Bien cordialement,

C

Dernière modification par Cristofgeorges (21/02/2010 01:45:35)

michael79 · 21/02/2010 21:18:47

Cristofgeorges a écrit :

Bonjour,
Je ne parviens pas à résoudre un souci d'affichage sous Internet Explorer (pas de souci avec les autres navigateurs) :
- la partie "main" est décalée en dessous, et, moins grave, tout est "scotché" à gauche...
- idem avec Opera, sans le retour vers la gauche, certes, mais la partie "main" est "en dessous" également...
L'adresse du site :
http://maisonperieux.org
j'ai essayé de changer les float et les widht, rien n'y fait...
Si quelqu'un a une idée et/ou la solution, merci d'avance pour le temps passé.
Bien cordialement,
C

Bonsoir,

Je regarde ça sur IE demain ( je suis sur mac ) et je vous dis quoi.

A bientôt,

Michaël

michael79 · 22/02/2010 14:47:31

Cristofgeorges a écrit :

Bonjour,
Je ne parviens pas à résoudre un souci d'affichage sous Internet Explorer (pas de souci avec les autres navigateurs) :
- la partie "main" est décalée en dessous, et, moins grave, tout est "scotché" à gauche...
- idem avec Opera, sans le retour vers la gauche, certes, mais la partie "main" est "en dessous" également...
L'adresse du site :
http://maisonperieux.org
j'ai essayé de changer les float et les widht, rien n'y fait...
Si quelqu'un a une idée et/ou la solution, merci d'avance pour le temps passé.
Bien cordialement,
C

Bonjour,

La disposition des blocs n'est pas classique:

Vous avez le menu (site) dans la partie principale (mid)
OK, mais la partie page (main) se trouve elle dans le
pied de page! (bot). Ce qui se trouve normalement dans
le pied de page est tout en bas à la fin de la zone page
avec un div sans style/classe CSS.

Donnez-moi le code de votre template.php et je le
corrige puis on avisera pour le CSS.

A bientôt,

Michaël

Cristofgeorges · 22/02/2010 16:05:59

Bonjour , merci encore !
Voici le code ci-dessous, y aurais je laissé trainer des "parasites" de codes de menus que j'ai enlevé ensuite ? possible...
Bonne chasse...

<!DOCT YPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title><?php echo $zite->content['menu_title'].' '.$zite->get_data('site_title') ?></title>
<link href="style.css" rel="stylesheet" type="text/css" />
<link rel="icon" type="iconeperieux2/ico" href="/deco/iconeperieux2.ico"/>
<SCRIPT language=javascript>
function popup(page,nom,option) {
window.open(page,nom,option); }
</SCRIPT>
</head>

<body>

<h2><?php echo $zite->get_data('site_subtitle') ?></h2>
</div>
<div id="mid">
<div id="side">
<?php echo $zite->content['menu'] ?>
<?php echo $zite->get_content(1156957918, true) ?>
</div>

<div id="bot">
<div id="main">
<?php echo $zite->content['main'] ?>
</div>

<div>

Site motorisé par <a href="http://zite.prositif.com" >ZITE CMS <?php echo ZITEVER ?></a> <a href="http://maisonperieux.org/index.php?z=login"> login </a></div>
</div>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-7244870-1");
pageTracker._trackPageview();
} catch(err) {}</script></body>
</html>

bmael · 22/02/2010 23:19:22

Salut Cristof,
Moi je dirais de faire comme ceci :

<body>

<div id="page">
<div id="top">
<h2><?php echo $zite->get_data('site_subtitle') ?></h2>
</div> 
<div id="mid">
<div id="side">
<?php echo $zite->content['menu'] ?>
<?php echo $zite->get_content(1156957918, true) ?>
</div>

<div id="main">
<?php echo $zite->content['main'] ?>
</div>

<div id="bot">
Site motorisé par <a href="http://zite.prositif.com" >ZITE CMS <?php echo ZITEVER ?></a> <a href="http://maisonperieux.org/index.php?z=login"> login </a></div>
</div> 
</div> 
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-7244870-1");
pageTracker._trackPageview();
} catch(err) {}</script></body>

Est-ce que ça résout ton problème ? Sinon, il faudrait voir le css également.

michael79 · 22/02/2010 23:20:58

bmael a écrit :

Salut Cristof,
Moi je dirais de faire comme ceci :
<body>
<div id="page">
<div id="top">
<h2><?php echo $zite->get_data('site_subtitle') ?></h2>
</div> 
<div id="mid">
<div id="side">
<?php echo $zite->content['menu'] ?>
<?php echo $zite->get_content(1156957918, true) ?>
</div> 

<div id="main">
<?php echo $zite->content['main'] ?>
</div> 
<div id="break"></div>

</div> 

<div id="bot">
Site motorisé par <a href="http://zite.prositif.com" >ZITE CMS <?php echo ZITEVER ?></a> <a href="http://maisonperieux.org/index.php?z=login"> login </a></div>
</div> 
</div> 
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-7244870-1");
pageTracker._trackPageview();
} catch(err) {}</script></body>

Est-ce que ça résout ton problème ? Sinon, il faudrait voir le css également.

J'allais le dire Voilà un template.php bien plus classique

Cristofgeorges · 23/02/2010 22:25:11

Messieurs, merci beaucoup de votre participation,

Alors : cela n'a pas suffit .
MAIS, je vais essayer de regarder dans le css, A MOINS que vous me disiez :

" mais, non, C, on a un peu de temps, c'est pas grand chose, on peut regarder si tu insistes "
"Vraiment, je ne voudrais pas...."
" Tu rigoles, pas de souci"
"Bon, mais vous êtes sûr, parce que..."
"Arrête tes salamalecs, vieux et pousse toi un peu, laisse regarder les pro..."

Bon, d'accord...

Je regarde et je me contremanifeste bientôt,

Merci encore pour le temps consacré,

Cristof

snypi · 24/02/2010 00:13:58

pour ma part cristofg. j'ai pas de temps à te consacré plus que ce que je m'apprête à faire
mais pour apprendre à maitriser ton css
je te conseille d'utiliser firefox (navigateur) avec un module supplémentaire qui s'appelle firebug
une fois installé firebug dans ton firefox tu trouvera une sorte d'icone type cafard en bas à droite de ton firefox
tu clic dessus et la apparait un onglet en bas de page ou tu peut modifier à la voler le code css pour faire des test sans pour autant altérer le vrai site
une fois la modif effectué qui te plait tu reproduit le code que tu à modifier dans ton vrai css

ceci te permet de faire des test et de trouver t'es solution

Perso sans avoir le css sous la main avec ie c'est dur !!

le css est monté avec un logique qui n'est pas la mienne !!
j'aime pas le padding du side de 158px
piste pour toi ! (attention sauvegarde ton css avant de faire ma modif)

#page {
	background-color:;
	border: solid 0px #CCC;
	border-top: none;
	width: 910px;
	margin: 0px auto 16px auto;
	border-left: 0px solid #777;
	border-right: 0px solid #777;
	padding: 0;
	text-align: left;
}

#top {
	width: 910px;
	height: 110px;
	background-image: url(deco/bannieresite2.jpg);
	border-bottom: none;
	margin:0;
	padding: 10px 0 0 0;
}

#mid {
	width: 910px;
	border-bottom: 0px solid #CCC;
	margin:0;
	madding: 0;
}

#side {
	width: 170px;
        height: 58%;
        font-size : 15pt;
        background-image: url(deco/decoleftside.jpg);
        background-repeat: no-repeat;
	float: left;
	margin: 0px;
	padding: 158px 8px 0px 10px;
}

#main {
	width: 650px;
	float: right;
	margin: 0;
	padding: 0px 0px 0px 0px;
	text-align: justify;
}

Dernière modification par snypi (24/02/2010 00:14:50)

Cristofgeorges · 24/02/2010 23:11:01

Bonjour-bonsoir !

Merci Snypi pour ton aide, et effectivement, je découvre avec plaisir Firebug !

J'ai refait des modif sur le css que tu m'as proposé, dans le padding du main, parce que ma petite phrase "Zite motorisé par..." se promenait ailleurs avec ta proposition, mais elle se ballade toujours selon les pages du zite avec mes modifs'........

Et, Ô surprise, grâce t'en soit rendue !: le site est maintenant "correct" sur Opera, mais toujours pas sur IE ( qui, décidément, ne présente plus beaucoup d'intérêt...si il en fut, bref...), et pourquoi ce p....de navigateur affiche (pas) autant de différence ?...

Bon, en tout les cas, MERCI à tous, je vais maintenant me dépatouiller grâce à vos conseils et au petit cafard de firebug, et continuer ainsi ma formation , (clin d'oeil à Maitre bmael)

A la prochaine,

snypi · 25/02/2010 07:49:49

Cristofgeorges a écrit :

padding du main, parce que ma petite phrase "Zite motorisé par..."

normalement cela ce trouve dans la <div> bot

ton problème vient aussi des t'es deux images
les voeux 2010 font 419 px de large et le diapo 358 soit un total de 777px
alors que la partie de ton site #main {
width: 650px;
ne fait que 650 px
j'avais fait un support pour s'initer au css sur le fofo http://www.zitecms.org/zite/forum/viewtopic.php?id=353
cela peut t'aider avec une petite formation avec le site du zero http://www.siteduzero.com/tutoriel-3-13 … part_13663

Cristofgeorges · 25/02/2010 13:21:19

Et beh merci encore,
j'ai effectivement viré le diapo de l'accueil ( j' verrai + tard) , et du coup ça s'affiche correctement partout,
c'est déjà l'essentiel,

Merci encore, merci, encore merci.

snypi · 25/02/2010 19:34:49

le principe si tu alligne deux images assure toi qu'elle ne dépasse pas les 650px soit 320 px pour chaque image + 2 px de séparation entre les image (exemple)2px+1er image de 320+2px+2px+ 2eme image 320+ 2 px = 648px.
sinon tu met t'es images en les une au dessous des autres avec un retour à la ligne

Forum ZitePLUS

#1 20/02/2010 15:11:51

problèmes d'affichage sous IE

#2 21/02/2010 21:18:47

Re : problèmes d'affichage sous IE

#3 22/02/2010 14:47:31

Re : problèmes d'affichage sous IE

#4 22/02/2010 16:05:59

Re : problèmes d'affichage sous IE

#5 22/02/2010 23:19:22

Re : problèmes d'affichage sous IE

#6 22/02/2010 23:20:58

Re : problèmes d'affichage sous IE

#7 23/02/2010 22:25:11

Re : problèmes d'affichage sous IE

#8 24/02/2010 00:13:58

Re : problèmes d'affichage sous IE

#9 24/02/2010 23:11:01

Re : problèmes d'affichage sous IE

#10 25/02/2010 07:49:49

Re : problèmes d'affichage sous IE

#11 25/02/2010 13:21:19

Re : problèmes d'affichage sous IE

#12 25/02/2010 19:34:49

Re : problèmes d'affichage sous IE

Pied de page des forums