Rechercher : dans
Par :

Mise en forme css ok sous firefox... sous IE

Dernière réponse le 20 nov 2008 à 08:05:16 delire, le 8 mai 2007 à 20:53:41 
 Signaler ce message aux modérateurs

Voila j'ai créé une feuille de mise en forme en css.. qui fonctionne tres biens sous firefox
Seul pb... les compatibilités.. c'est pourtant pas du code exotique mais sous Ie c'est la merde.... je sais vraiment plus koi faire


/*----------------CSS-----------------*/
/*-------------------------- mise en forme des bandes---------------------*/
html, body {
width: 100%;
height: 100%;
}
body {
margin: 0;
padding: 0;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
background-color: #000000; /*couleur de fond blanche*/
overflow:hidden;
}
.conteneur { /*le conteneur global du site, qui sera centré */
width: 100%;
height: 100%;
position: absolute;
background-color: #transparent;
overflow:hidden;
left:0;
}

.header {
height: 92px;
background-color:#000000;
overflow:hidden;
}

.frame {
position:static;
left:0;
width: auto;
height: 75%;
background-color:transparent;
overflow: auto;
}
p {margin: 0 0 10px 0;}

.footer {
background-color:#000000;
height:inherit;
}

/*------------------------------- Fin de la mise en forme --------------------------*/
/*                                                                                  */
/*                                                                                  */
/*------------------------------- Style de police ----------------------------------*/




index.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title>4 zones avec scroll</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design 1" href="style_tana.css" /> 
<style type="text/css">
<!--
/* CSS issu des tutoriels css.alsacreations.com */

</style>
</head>

<body>
<div class="conteneur">
	<div class="header">
	<?php  include'menu.html' ?>
	</div>
	
	<div class="frame">
	<?php  include'bio2.html' ?>  
	</div>

	<div class="footer">contenu du footer </div>
</div>
</body>
</html>





</textarea>
    <center>
<table border="0" cellpadding="0" cellspacing="0" height="18"><tr><td valign="top"><input type="submit" value="Ajouter"><input type="submit" name="Previsualiser" value="Previsualiser"></form></td><td valign="top"><form action="/ccmguide/ccmforum.php3#redaction" method="post"><input type="submit" value="Aide"></form></td></tr></table></center>
</td></tr></table>

<p>Identification Rapide :<br><table style="border:1px;padding:4px;border-color:#B7B7B7;background-color:#D6DEF7;width:400px;">

<tr><td><form name="ident" action="/forum/forum-24-webmastering#ecrire" method="post">
<input type="hidden" name="page" value="1">
<input type="hidden" name="ID" value="0"><input type="hidden" name="cat" value="24">
<span class="Texte"> Pour voir les champs ci-dessus remplis automatiquement, vous avez la possibilit&eacute; en tant que membre de vous identifier :</span>
<center><table class="no" style="border:1px;border-color:#B7B7B7;background-color:#EFF2FB;padding:2px;width:50%"><tr><td>Identifiant</td><td><input name="login" maxlength="32" type="text" value="" size="30"></td></tr>
<tr><td>Mot de passe</td><td><input name="pass" maxlength="32" type="password" size="30"></td></tr></table>
<br><input type="submit" name="Identification" value="Identification">
</form>
</center></td></tr></table></span>
</td></tr></table></center>
 </td></tr>
 </table>
</div></td></tr><tr><th colspan="3">&nbsp;</th></tr>
</table></div></div><div id="footer">
<script type="text/javascript">
<!--
xtnv = document;           //affiliation frameset : document, parent.document ou top.document
xtsd = "http://logc15";
xtsite = "254140";
xtn2 = "";           //utiliser le numero du niveau 2 dans lequel vous souhaitez ranger la page
xtpage = "forum::forum-24-webmastering";             //placer un libellé de page pour les rapports Xiti
xtdmc = ".commentcamarche.net";           //Domaine cookie en ".monsite.fr" (optionnel)
xtprm = "";           //Paramètres supplémentaires (optionnel)
//-->
</script>
<script type="text/javascript" src="/remote/xiti.js"></script>
<noscript>
<img width="1" alt="" height="1" src="http://logc15.xiti.com/hit.xiti?s=254140&amp;p=&amp;" >
</noscript>
<br><table class="glossaire"><tbody><tr>
<td><a href="/glossaire/"><b>Glossaire</b></a></td>
<td><a href="/glossaire/a">A</a></td>
<td><a href="/glossaire/b">B</a></td>
<td><a href="/glossaire/c">C</a></td>
<td><a href="/glossaire/d">D</a></td>
<td><a href="/glossaire/e">E</a></td>
<td><a href="/glossaire/f">F</a></td>
<td><a href="/glossaire/g">G</a></td>
<td><a href="/glossaire/h">H</a></td>
<td><a href="/glossaire/i">I</a></td>
<td><a href="/glossaire/j">J</a></td>
<td><a href="/glossaire/k">K</a></td>
<td><a href="/glossaire/l">L</a></td>
<td><a href="/glossaire/m">M</a></td>
<td><a href="/glossaire/n">N</a></td>
<td><a href="/glossaire/o">O</a></td>
<td><a href="/glossaire/p">P</a></td>
<td><a href="/glossaire/q">Q</a></td>
<td><a href="/glossaire/r">R</a></td>
<td><a href="/glossaire/s">S</a></td>
<td><a href="/glossaire/t">T</a></td>
<td><a href="/glossaire/u">U</a></td>
<td><a href="/glossaire/v">V</a></td>
<td><a href="/glossaire/w">W</a></td>
<td><a href="/glossaire/x">X</a></td>
<td><a href="/glossaire/y">Y</a></td>
<td><a href="/glossaire/z">Z</a></td>
</tr></tbody></table><br><a href="/ccmguide/ccmintro.php3"><b>A propos</b></a> | <a href="/ccmguide/cgu-conditions-generales.php3"><b>Conditions g&eacute;n&eacute;rales</b></a> | <a href="/plan/"><b>Plan</b></a> | <a href="/contact/"><b>Contact</b></a> | <a href="/guide-achat/constructeurs.php3"><b>Index des marques</b></a> | &copy; Tous droits r&eacute;serv&eacute;s 2007 <a href="http://www.commentcamarche.net">Quidéa</a>
</div>		<SCRIPT LANGUAGE=JavaScript>
		<!--
		var RN = new String (Math.random());
		var RNS = RN.substring (2,11);
		document.write('<SCRIPT language="JavaScript1.1" src="http://mediafr.247realmedia.com/... + RNS + '@x01?"><'+'/script>');
		//-->
		</script>
		
</body>
</html>
Configuration: Windows XP
Firefox 2.0.0.3

Meilleures réponses pour « mise en forme css ok sous firefox... sous IE » dans :
[Mozilla Firefox] Sauvegarder les paramètres VoirSauvegarder / Restaurer les paramètres de Firefox, les marque-pages, historique et les extensions installées Commencez par afficher les fichiers cachés. Sous Vista, il faut s'approprier le dossier C:\users\Utilisateur*\Application Data pour...
[Excel] Colorer des cellules sur conditions VoirIl existe dans Excel des fonctions très pratiques mais peu connues et peu utilisées. Exemple : vous souhaitez qu'une cellule se colore automatiquement en rouge (ou autre mise en forme de police, de bordure, de trame) selon une condition : un...
Faire un zoom rapide sous Firefox / IE VoirFaire un zoom sur une fenêtre de Mozilla Firefox ou Internet Explorer ? Sous Internet Explorer on peut aussi faire un zoom en bas a droite de la page : Mais il y a une autre façon que celle-ci pour Internet Explorer ET Mozilla Firefox,...

1

ptibenou, le 8 mai 2007 à 21:01:58

Salut,

Je ne t'apporterai pas de solution car je ne suis pas assez fort dans ce domaine.
Cependant si mes souvenirs sont bon cela dépends de la version des navigateurs. les spécifications CSS2 étant en avance avec firefox je ne sais pas si les dernières versions de IE les acceptent.

Répondre à ptibenou

2

delire, le 8 mai 2007 à 21:16:12
  • +1

L'interet c'est qu'un site soit sonsultable partout... la j'ai IE 6.0... donc c'est pas non plus le 5...

Répondre à delire

3

ptibenou, le 8 mai 2007 à 21:52:54
  • +1

Salut,

Tu demandes de l'info et tu doutes de ce qu'on te dit, qu'à cela ne tienne voici ce qui semble le confirmer :

http://www.blog-and-blues.org/...

Seule certaines parties du CSS2 sont prisent en compte dans IE6.0

Par contre ce que tu aurais pu me rétorquer c'est que tu n'utilises pas de CSS2 mais je t'ai déjà dis que j'étais pas assez fort pour le vérifier!

Bon courage,

Répondre à ptibenou

8

Gihef, le 9 mai 2007 à 00:52:30

Même si tu as raison, c'est bon signe qu'il doute.
Tu en fait autant : “si mes souvenirs sont bon”.
Et puis, “je ne suis pas assez fort dans ce domaine”.
Et tu ne donnes pas de quoi vérifier.

Le doute est sain (santé).
 

Répondre à Gihef

4

delire, le 8 mai 2007 à 22:00:47

Autant pour moi... mais ca me parait pas tres poussé comme css.... ce que j 'utilise.

merci

Répondre à delire

5

Lapinkiller, le 8 mai 2007 à 22:53:02

En même temps IE c'est de la merde
lemieux serait de faire une feuille csss pour mozilla et une autre pour IE et selon le navigateur qui affiche la page la page correspond au navigateur est utilisée Lapinkiller, étudiant en BTS IRIS (informatique et réseaux...)
"La fin du monde n'est pas pour demain, elle est arrivée hier" (Lapinkiller)

Répondre à Lapinkiller

11

Dalida, le 10 mai 2007 à 01:18:51

Salut,

plutôt définitif comme avis…
ce n'est surement pas avec des arguments comme ceux là que l'on fera avancer la cause !

je pense que l'utilisation de hacks et de règles spécifiques est la pire des choses, sauf cas exceptionnel.

si tu veux profiter au mieux des standards il vaut mieux te restreindre aux limites du possible (qui sont assez vaste quand on prend le temps de comprendre les défauts des navigateurs et que l'on joue avec) pour garantir la pérennité du code.
[ Mathieu ]
Comprenne qui peut, succombe qui doit…

Répondre à Dalida

6

delire, le 8 mai 2007 à 23:03:12

Tu as une idée du script ?

Répondre à delire

7

Gihef, le 9 mai 2007 à 00:46:24

Ce qui “est la merde” c'est ta manière de coder et de présenter le code.
Il est bien brave ce Firefox.

Le code que tu donnes est bien tout ce que tu exploites, tel quel ?
Il ne manque rien ? Tout est bien dans cet “ordre”-là ?

Parce que http://cjoint.com/data/fja4lGBzhA.htm.
Il n'a pas tout compris… Il est perdu.
 

Répondre à Gihef

9

Jacobéo, le 9 mai 2007 à 06:36:56
  • +1

Bonjour Delire,

Là, ce n'est pas bon, pourquoi cette différence ?

position: absolute;
background-color: #transparent;

height: 75%;
background-color:transparent;
overflow: auto;

Et puis, pas sur que IE accepte cet argument "transparent".


Internet ne vaut que s'il est partagé ...
Jacques

Répondre à Jacobéo

10

delire, le 9 mai 2007 à 20:51:35

Pour IE je sais pas, mais si tu connais une maniere alternative pour faire un include et garder l'image de fond de l'include suis prenneur..

Répondre à delire

12

Dalida, le 10 mai 2007 à 09:18:05
  • +1

Salut,

désolé de répéter ce que te dis Gihef, mais si le code que tu utilises est celui que tu as collé au dessus, ton premier problème c'est de réussir à rédiger un document html correct. les règles de style en en-tête que tu as mis en commentaire contiennent aussi la fermeture de la balise <head>. inutile d'aller plus loin. et si FF t'affiche quelque chose c'est qu'il est plus que tolérant.

en plus, tu choisis le DTD xhtml 1.0 Strict (le plus rigoureux) alors que tu ne semble pas connaitre xhtml (balise en majuscules, balise mal ou pas fermée…). la encore le navigateur est bien gentil d'afficher quelque chose. ton code n'est pas exotique, il n'est qu'une succession d'erreurs de rédaction.
regarde chez SelfHTML par exemple.
[ Mathieu ]
Comprenne qui peut, succombe qui doit…

Répondre à Dalida

13

pierremarc35, le 19 nov 2008 à 09:42:25

Salut à tous !

J'avais le même problème que vous et en m'acharnant à chercher une solution, je suis tombé sur un site anglophone qui apporte la solution.
Je vous passe les détails et vous offre le code qui fonctionne sous IE7 :

Il est indispensable d'écrire les 3 premières lignes et d'utiliser le style de mise en forme.
Pour le reste libre à votre imagination ...

Vous pouvez tester ce code en le copiant dans dans un fichier HTML !!!

ATTENTION CEPENDANT, ce code ne donne pas du tout la même chose avec FireFox...

Si vous utiliser du php pensez à detecter le type du navigateur ("msie" pour internet explorer) !

<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN' 'http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd'>
<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01//EN' 'http://www.w3.org/TR/html4/strict.dtd'>
<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Frameset//EN' 'http://www.w3.org/TR/html4/frameset.dtd'>

<HTML>
<HEAD>
<TITLE>AFFICHAGE D'UN TABLEAU AVEC CONTENU DEROULANT</TITLE>
<META http-equiv=Content-Type content=text/html; charset=iso-8859-1>
<STYLE type=text/css>
	.outer {
		width: 500px;
		padding-top: 50px; 
		position: relative ;
	}

	.innera {
		overflow: auto; 
		width: auto;
		height: 50px; 
	}

	.outer thead Tr
	{
		position:absolute;
		top:10px; 
		height:30px;
	}
</STYLE>
</HEAD>
<BODY>
AFFICHAGE D'UN TABLEAU AVEC CONTENU DEROULANT :
</BR></BR>
<DIV CLASS=outer>
<DIV CLASS=innera>
<TABLE>
	<THEAD>
		<TR>
			<TD>Colonne A</TD>
			<TD>Colonne B</TD>
			<TD>Colonne C</TD>
			<TD>Colonne D</TD>
			<TD>Colonne E</TD>
			<TD>Colonne F</TD>
		</TR>
	</THEAD>
	<TBODY>
		<TR>
			<TD>A 1</TD>
			<TD>B 1</TD>
			<TD>C 1</TD>
			<TD>D 1</TD>
			<TD>E 1</TD>
			<TD>F 1</TD>
		</TR>
		<TR>
			<TD>A 2</TD>
			<TD>B 2</TD>
			<TD>C 2</TD>
			<TD>D 2</TD>
			<TD>E 2</TD>
			<TD>F 2</TD>
		</TR>
		<TR>
			<TD>A 3</TD>
			<TD>B 3</TD>
			<TD>C 3</TD>
			<TD>D 3</TD>
			<TD>E 3</TD>
			<TD>F 3</TD>
		</TR>
		<TR>
			<TD>A 4</TD>
			<TD>B 4</TD>
			<TD>C 4</TD>
			<TD>D 4</TD>
			<TD>E 4</TD>
			<TD>F 4</TD>
		</TR>
		<TR>
			<TD>A 5</TD>
			<TD>B 5</TD>
			<TD>C 5</TD>
			<TD>D 5</TD>
			<TD>E 5</TD>
			<TD>F 5</TD>
		</TR>
		<TR>
			<TD>A 6</TD>
			<TD>B 6</TD>
			<TD>C 6</TD>
			<TD>D 6</TD>
			<TD>E 6</TD>
			<TD>F 6</TD>
		</TR>
		<TR>
			<TD>A 7</TD>
			<TD>B 7</TD>
			<TD>C 7</TD>
			<TD>D 7</TD>
			<TD>E 7</TD>
			<TD>F 7</TD>
		</TR>
	</TBODY>
</TABLE>
</DIV>
</DIV>
</BODY>
</HTML>

Répondre à pierremarc35

14

 Dalida, le 20 nov 2008 à 08:05:16

Salut,

3 DTD c'est totalement inutile, non ?

pas étonnant que FF ne veuille pas afficher ce que tu attends !!!
-;o)
[ Mathieu ]

Il y a sûrement des pandas pour ne dépendre de rien

Répondre à Dalida