Css, IE, opéra, firefox

Résolu/Fermé
midnnight Messages postés 484 Date d'inscription jeudi 23 février 2006 Statut Membre Dernière intervention 26 juillet 2017 - 25 juin 2009 à 18:13
midnnight Messages postés 484 Date d'inscription jeudi 23 février 2006 Statut Membre Dernière intervention 26 juillet 2017 - 29 juin 2009 à 02:49
Bonjour,
Il y a des moments de grande solitude ! lol.
Quand j'ai eu fini mon css qui fonctionnait super sous IE et Opéra, il m'est venu l'envie de le tester avec firefox et là, c'est la catha !!!
Tout est en vrac sur firefox, voyez vous mon (mes) erreur(s) ???
Merci par avance, j'ai beaucoup boss&é dessus...!!!...
  body
  {
  background:black;
  }
#conteneur
{
   width:auto;
   margin-top:20px;
   padding-bottom:25px;
   background-image:url(images/fond.jpg);
   padding-top:5px;
}

#colonne1
{
   width:180px;
   height:450px;
   background-image:url(imgs/d_g.jpg);
   float:left;
   border: 0px solid green;
}
#colonne1b
{
   width:100%;
   height:160px;
   background-image:url(imgs/boule_g.gif);
   background-reprat:no-repeat;
   float:left;
   border: 0px solid #505F7D;
}
<!-- colonne droite -->
#colonne2
{
   width:180px;
   height:450px;
   background-image:url(imgs/d_g.jpg);
   float:right;
   border: 0px solid green;
}
#colonne2b
{
   width:100%;
   height:160px;
   background-image:url(imgs/boule_d.gif);
   background-reprat:no-repeat;   
   float:right;
   border: 0px solid #505F7D;
}
<!-- header -->
#header
{
   width:100%;
   height:18%;
   background-image:url(imgs/h.jpg);
   float:center;
   border: 1px solid yellow;
}
<!-- center -->
#colonne3
{
   width:100%;
   height:400px;
   background-color:#CCCCFF;
   background-image: url(imgs/tx.jpg);
   float:center;
   border: 1px solid white;
}
#footer
{
width:100%;
Height:10%;
background-image:url(imgs/h.jpg);
margin-top:30%;
font'size:11px;
color:white;
}
A voir également:

14 réponses

math 2000 Messages postés 2579 Date d'inscription dimanche 9 septembre 2007 Statut Membre Dernière intervention 7 mai 2016 404
25 juin 2009 à 19:20
le html stp ou mieux la page en ligne
0
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 920
25 juin 2009 à 22:40
salut,

+ 1000 pour Math 2000, on est pas des voyantes quand même !
-:oD
0
midnnight Messages postés 484 Date d'inscription jeudi 23 février 2006 Statut Membre Dernière intervention 26 juillet 2017 38
26 juin 2009 à 00:32
Mille sorry !!!!

Code ok dans IE and Opéra...
<html>
<!-- Date de création: 25/06/2009 -->
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  <title></title>
  <meta name="description" content="">
  <meta name="keywords" content="">
  <meta name="author" content="midnnight17">
  <meta name="generator" content="WebExpert 6">
  <style type="text/css"> 
  body
  {
  background:black;
  }
#conteneur
{
   width:auto;
   margin-top:20px;
   padding-bottom:25px;
   background-image:url(images/fond.jpg);
   padding-top:5px;
}
 
#colonne1
{
   width:180px;
   height:450px;
   background-image:url(imgs/d_g.jpg);
   float:left;
   border: 0px solid green;
}
#colonne1b
{
   width:100%;
   height:160px;
   background-image:url(imgs/boule_g.gif);
   background-reprat:no-repeat;
   float:left;
   border: 0px solid #505F7D;
}
<!-- colonne droite -->
#colonne2
{
   width:180px;
   height:450px;
   background-image:url(imgs/d_g.jpg);
   float:right;
   border: 0px solid green;
}
#colonne2b
{
   width:100%;
   height:160px;
   background-image:url(imgs/boule_d.gif);
   background-reprat:no-repeat;   
   float:right;
   border: 0px solid #505F7D;
}
<!-- header -->
#header
{
   width:100%;
   height:18%;
   background-image:url(imgs/h.jpg);
   float:center;
   border: 1px solid yellow;
}
<!-- center -->
#colonne3
{
   width:100%;
   height:400px;
   background-color:#CCCCFF;
   background-image: url(imgs/tx.jpg);
   float:center;
   border: 1px solid white;
}
#footer
{
width:100%;
Height:10%;
background-image:url(imgs/h.jpg);
margin-top:30%;
font'size:11px;
color:white;
}
</style>
</head>
<body>
<div id="colonne1">
<div id="colonne1b">
+++</div>
     Hello world!</div>
 
<!-- !!!! -->
   <div id="colonne2">
 
  I try</div>
   <!-- header -->
    <div id="header"><center>  <img src="imgs/PROGYLimgVII.gif" border="0" width="549" height="89" alt=""></center></div>
<!-- center -->   
   <div id="colonne3">
  P0
 
 
 

<div id="footer">ByyyP=Foot,Tenis-man...!</div> 
   </div>
</body>
</html>

0
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 920
26 juin 2009 à 00:35
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
midnnight Messages postés 484 Date d'inscription jeudi 23 février 2006 Statut Membre Dernière intervention 26 juillet 2017 38
26 juin 2009 à 00:45
Merci pour le lien
(Je ne sais pas si va va suffir...Mais C cool c'est vrai qu'on a tendance à oublier ça, BIEN de le rappeler !)
0
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 920
26 juin 2009 à 00:47
mets ça en première ligne de ton document :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

moi, je vais me coucher !
0
midnnight Messages postés 484 Date d'inscription jeudi 23 février 2006 Statut Membre Dernière intervention 26 juillet 2017 38
26 juin 2009 à 00:54
Merci beaucoup de ta participation et good night !!!
A+
(idem, je marque résolu dès que testé, bYz, fatigué aussi...à demain.)
0
midnnight Messages postés 484 Date d'inscription jeudi 23 février 2006 Statut Membre Dernière intervention 26 juillet 2017 38
26 juin 2009 à 14:34
Aille, css toujours en vrac dans firefox, avec le "DTD", l'interface c'est amméliorée dans Opéra, mais ça passait bien déjà avant, mais c'est en vrac aussi dans IE 8 maintenant, je retire donc le DTD...
HEEEELP !!!
Et comme un lien vaut mieux qu'1 grand discours ! Le voili, le voila :
http://demostock.lescigales.org/essai3.html
Merci mille fois à vous, je suis présent aujourd'hui, de 14h30 à 16h30 (fête de l"école ensuite, je vais voir mon bout d'choux) puis de retour vers 20h et ce WE sans prob...
Merci par avance, A+++
0
math 2000 Messages postés 2579 Date d'inscription dimanche 9 septembre 2007 Statut Membre Dernière intervention 7 mai 2016 404
26 juin 2009 à 14:39
tu dis qu'il fonctionne sous ie et opéra mais moi j'ai pas le même affichzge sous ie opéra et firefox et safaris
il est différent sous chasue navigateur ton site
il vaut mieux créer son site pour firefox et ensuite l'adapter
0
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 920
26 juin 2009 à 14:43
salut,

je retire donc le DTD
grosse erreur.
oublie tout ce que tu as fait et repars avec un document valide et propre sinon tu vas courir après de fausses solutions sans pouvoir définir le problème.
0
midnnight Messages postés 484 Date d'inscription jeudi 23 février 2006 Statut Membre Dernière intervention 26 juillet 2017 38
26 juin 2009 à 15:14
Bon, snif, je le reprend à 0 à partir de firefox, et du DTD, si celui-ci n'est pas rattrappable...ffff, j'me suis trop branché php, je m'y retrouve plus dans css du coup, lol,
merci...
(mon Dieu, mais quand feront-ils des navigateurs qui traduisent le même code valide, qu'on s'y retrouve ! Lol !)
Re=>('suis toujours preneur d'idées, au cas où, pour savoir où ça bugg...)
0
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 920
26 juin 2009 à 15:30
suis toujours preneur d'idées, au cas où, pour savoir où ça bugg
c'est justement là le problème !
avec du code valide, les navigateurs ont des rendus différents (ceci dit, maintenant il y a finalement assez peu de différences).
avec du code invalide, c'est encore pire puisqu'on ne sait même pas quel comportement on est censé attendre.
0
J'ai donc tout repris à Z, c'est beaucoup mieux, mais 2 petits probs, svp :
(pour l'instant je travaile en local)
je voudrais bien comprendre...
'margin-top' ne fonctionne pas sous IE 8 mais fonctionne sous firefox et Opéra.
Par contre sous Opéra et IE 8 mon tableau est inclus dans mon div class="centre" (le 'background-image: url(imgs/tx.jpg); suit mes espaces, donc mon futur texte)
mais pas sous firefox (mon background-image: url(imgs/tx.jpg); s'arrête au milieu de mes espaces (br /) pourtant je l'ai codé à 100%...(?)
Je ne trouve pas mes erreurs...Je ne dois pas tester les bons css...Une petite aide? ce s'rait sympa...
  .centre {
margin: 1em 20%;
background-color:#CCCCFF;
background-image: url(imgs/tx.jpg);
margin-top:1%;
height:100%;
}


le html :
<div class="centre">
<center><table summary="" border="1" background-color"white" width="80%"; height="80%">
                    	<tr>
                    		<td style="margin-left:5px"><br />
blablabla<div class="box-footer">FOOTER<br /></div>
</div>&nbsp;</td>
                    	</tr>
                    </table></center>
<div class="box-footer">footer<br /></div>
&nbsp;</td>
                    	</tr>
                    </table></center></div><!--(mon footer est inclus dans mon tableau, c'est voulu)-->
0
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 920
28 juin 2009 à 22:12
salut,

bravo pour le redémarrage mais tant qu'à faire tu abandonnerais pas les <tables> ?

tu vas me trouver lourd mais la technique est déconseillée depuis 1999, faudrait s'y mettre…

+ http://www.w3.org/2002/03/csslayout-howto.html.fr

+ https://www.alsacreations.com/tuto/lire/538-Construire-un-site-sans-tableaux.html

+ http://css.mammouthland.net/mise-en-page-sans-tableau.php

+ https://openweb.eu.org/articles/problemes_tableaux

+ http://www.pompage.net/traduction/csspratique
0
midnnight Messages postés 484 Date d'inscription jeudi 23 février 2006 Statut Membre Dernière intervention 26 juillet 2017 38
29 juin 2009 à 02:49
Oki,
Donc voici mon nouvel aménagement de ce qui est noté au dessus :
  .centre {
margin: 1em 20%;
background-color:#CCCCFF;
background-image: url(imgs/tx.jpg);
margin-top:1%;
height:100%;
}
<!--pied-->
.box-footer
    {

margin-top:10%;
    width:100%;
    Height:40px;
    background-image:url(imgs/h.jpg);
    font-size:11px;
    color:white;	
    }

le html :
<div class="centre">
<center><div style="border solid:1px;background-color:white; width:80%; height:80%"><br />
blablabla<div class="box-footer">footer<br /></div></div>
</center></div><!--(mon footer est inclus dans le div, c'est voulu)-->

Avec mes excuses, le prob venait du fait que j'avais encore oublié le DTD
(promis, je l'fait pas exprès. Bon par contre, du coup j'ai remplacé mon tableau, lol, y'a pas que du mauvais pour ce post...
Merci beaucoup !!! à +++
0