28172 sujets

CSS et mise en forme, CSS3

Probleme de compatibilie Ie /firefox

Je développe un site perso, et jusqu a hier, je n avais jamais pense a checker sous IE. J ai ete assez surpris en ouvrant la page IE en decouvrant mon site sans dessus dessous. Je vous laisse admirer le desastre

http://bouletsensei.freeheberg.com

Si une ame charitable serait prete a jete un oeil au code CSS, j en serais ravi! Le probleme vient clairement de l alignement des DIV. J ai seulement copier les lignes qui pourrais etre l origine de ma nuit blanche d hier

Merci par avance et bonne journee



div#head {
	background-image: url(pictures/banniere4.png);
  	top: 0;
	margin-left : 0px;
	width: 900px;
	height: 140px;
	background-repeat: no-repeat;
	margin-left:0px;
			}

#balle {
	width:100px;
	height: 100px;
	margin-top:5px;
	margin-left: 10px;	
background-image:none;
}

div#left {
   font-size: 12px;
   background-image: url(pictures/stripe2.png);
	background-size:auto;
	width: 150px;
	height: 650px;
	float: left;
	border-top:0px solid #424755;
	border-left: 1px solid #424755;
	border-right: 1px solid #424755;
   
	margin: 0 auto;
		}


div#main {
	width:600px;
	min-height:650px;
	height: auto;
	float:left;
	background-image:url(pictures/elephant3.png);
	background-color: white;
	background-repeat:no-repeat;
	border-right: 1px solid #424755;
	margin: 0 auto;
	font-size:12px;
	text-align:left;
	border-top:0px solid #424755;

	font-size: 11px;
}

div#right 
{
	width:150px;
	min-height:650px;
	height: auto;
	float:left;
	background-image: url(pictures/stripe2.png);
	background-size:auto;
	border-right: 1px solid #424755;
	margin: 0 auto;
	font-size:12px;
	text-align:left;
	border-right:1px solid #424755;
	font-size: 11px;
	
}

#right a:hover, #right li a:right, #right li a:active
{
	border=0px;
}


#main p
{
	font-size:13px;
	font-family:"Comic Sans MS";
}

#main table {
	
	font-size:12px;
	
}
body
{
   text-align: center;
   font-family:"Comic Sans MS";
   background-image: url(pictures/path-to-stripe.png);
   font-size: 10px;
   margin-left:7%;
   margin-top:20px;
    }

div#foot {
clear: both;
margin-left:202px;
width: 625px;
height: 45px;
font-family: "Arial", "Tmes New Roman", "Arial Black", Verdana, serif;
position:static;
font-size:12px;
color: white;
}
En même temps mélanger styles css et balises html de mise en forme (ex : <center>) est rarement source de quiétude.

Essaye déjà de revoir l'ensemble de ton code en suivant les règles de base de la programmation web moderne :

- Respecter un standard unique (HTML4 ou XHTML...)
- Séparer au mieux les couches (javascript, CSS, HTML..)

Si un investissement minimum est requis, il te sera sûrement plus profitable que les nuits blanches passées à essayer de centrer un div Smiley cligne

PS : pourquoi mettre ton site dans une frame ?
Modifié par SolMJ (08 Oct 2008 - 13:32)
Hello,

Commence avant tout par faire valider ta page HTML, et revois ton CSS, tu as des coquilles dans tes définitions et tes polices ainsi que des doubles déclarations.

Accesoirement, ta page n'est pas accesible, je ne peux donc pas t'en dire plus ^^

Edit : Ah non, c'est bon c'est revenu.
Modifié par Tymlis (08 Oct 2008 - 13:45)
merci pour vos conseils a vous 2. Effectivement, melanger balises HTML et CSS n est pas une solution tres intelligente, mais je ne saivais plus trop comment faire. Je vais donc reprendre mes pages et enlever les balises HTML.

Je pense que par valider mes pages, tu veut dire sur le site du W3C ?

Et pour l accessibilite, je n y peut rien, un serveur gratuit n est jamais tres top.

En tout cas, je suis vos conseils, et si je ne m en sort pas, je reposterai.

Merci de m avoir accorde du temps et bonne journee (c est deja le soir chez moi) Smiley cligne
merci bien ! j en prends bonne note

mais je ne voit pas pourquoi vous me parler de frame car je n en ai pas, tout est fait a base de div
Modifié par boulet-sensei (08 Oct 2008 - 15:41)
boulet-sensei a écrit :
merci bien ! j en prends bonne note

mais je ne voit pas pourquoi vous me parler de frame car je n en ai pas, tout est fait a base de div



Tu en es vraiment sûr ? Smiley rolleyes 


<html>
        <head>
                <title>http://bouletsensei.freeheberg.com</title>
                <meta name="generator" content="ORT - Ovh Redirect Technology">
                <meta name="url" content="ns6.freeheberg.com/~bouletse/">
                <meta name="robots" content="all">
        </head>
        <frameset rows="100%,0" frameborder=no border=0>

                <frame name="ORT" src="http://ns6.freeheberg.com/~bouletse/">
                <frame name="NONE" src="" scrolling="no" noresize>
                <noframes>
                        <body><a href="http://ns6.freeheberg.com/~bouletse/">Click here</a><hr></body>
                </noframes>
        </frameset>
</html>
oui, si tu veux voir mon code source lit bien, il se trouve a :

http://ns6.freeheberg.com/~bouletse/

en fait, je n y peut rien, c est un serveur gratuit, et je n ai aucun moyen de l enlever. c est pour fourrer sa pub (que j ai dailleur reussi a faire sauter avec un simple <!-- en le faisant passer pour un commentaire)

Tu comprends ce que je veux dire?

deja 11h15 chez moi, pas trop le temps de trainer, je vous souhaite une bonne fin de journee, je repasse demain. bye
Modifié par boulet-sensei (08 Oct 2008 - 16:16)
Sujet clos
Aller à