[CSS] Texte, DIV, mauvaise taille dans IE....

Marsh Posté le 30-06-2004 à 11:33:03

Voir post tout en bas.

Message édité par Leuen le 18-08-2004 à 12:09:12

Reply

Marsh Posté le 30-06-2004 à 11:33:03

Reply

Marsh Posté le 30-06-2004 à 11:35:22

ou là c'est un peu bizarre, tu utilise left et right en meme temps. Il doit etre un peu perdu là

---------------
La bave du crapaud n'empèche pas la caravane de passer .

Reply

Marsh Posté le 30-06-2004 à 11:56:17

Oui mais j'ai pas tellement d'autre solutions et sous Mozilla &a marche super bien.

Parceque en fait chiffres se dimensionne automatiquement en fonction de la taille de la fenêtre et reste néanmoins toujours à la même distance des bords gauches et droits ce qui est indispensable car à gauche et a droite il y a des images... Enfin c'est pas facile à expliquer.

Reply

Marsh Posté le 01-07-2004 à 09:21:47

J'ai les div chiffres et liens qui ne s'affichent pas sous IE mais parfaitement sous Mozilla.

Un autre truc super étonnant est que je croyais avoir oublié de fermer un div. Je met une balise fermante, ça a amélioré pas mal de choses sous IE. Après coup en mettant de l ordre dans mon code, je m'appercois que la balise ne manquait pas, donc elle est à double. Mais sans cette balise fermante c est le bordel total sous IE. [:jkley]

Je vous met mon code html et mes CSS svp dites moi si vous voyez le problème ! :sweat:

Code :

body {
font-family : arial ;
}
#portail {
position : absolute ;
bottom : 0px ;
left : 0px ;
right : 0px ;
top : 0px ;
width : 100% ;
height : 100% ;
}
#logo {
position : absolute ;
background-image : url(../../images/logoPortail.gif) ;
background-repeat : no-repeat ;
top : 0px ;
left : 0px ;
width : 232px ;
height : 50px ;
padding : 0px ;
z-index : 1 ;
}
#homme {
position : absolute ;
background-image : url(../../images/homme_trait.jpg) ;
background-repeat : no-repeat ;
bottom : 0px ;
left : 0px ;
width : 185px ;
height : 483px ;
padding : 0px ;
}
#recherche {
position : absolute ;
top : 0px ;
right : 0px ;
width : 239px ;
height : 65px ;
}
.recherche {
margin-top : 12px ;
padding-left : 16px ;
}
.rechOption {
padding : 0px ;
padding-left : 22px ;
}
input {
border-color : rgb(0,0,0) ;
border-width : 1px ;
font-size : 9px ;
size : 15px ;
}
form {
font-size : 10px ;
}
#femme {
position : absolute ;
background-image : url(../../images/femme.jpg) ;
background-repeat : no-repeat ;
bottom : 0px ;
right : 0px ;
width : 207px ;
height : 126px ;
padding : 0px ;
}
#chiffres {
position : absolute ;
background-image : url(../../images/chiffres.jpg) ;
background-repeat : repeat-x ;
bottom : 5px ;
left : 185px ;
right : 185px ;
height : 16px ;
z-index : 1 ;
padding : 0px ;
}
#centre {
position : absolute ;
background-image : url(../../images/centre.jpg) ;
background-repeat : no-repeat ;
bottom : 35% ;
left : 20% ;
width : 455px ;
height : 135px ;
z-index : 1 ;
padding : 0px ;
}
#nouvelle {
position : absolute ;
right : 5% ;
top : 20% ;
width : 20% ;
height : 15% ;
overflow : hidden ;
text-align : center ;
border-right : 2px solid rgb(80,80,80) ;
border-bottom : 2px solid rgb(80,80,80) ;
border-left : 2px solid rgb(80,80,80) ;
border-collapse : collapse ;
z-index : 2 ;
}
#manifestation {
position : absolute ;
right : 5% ;
top : 40% ;
width : 20% ;
height : 15% ;
overflow : hidden ;
text-align : center ;
border-right : 2px solid rgb(80,80,80) ;
border-bottom : 2px solid rgb(80,80,80) ;
border-left : 2px solid rgb(80,80,80) ;
border-collapse : collapse ;
z-index : 2 ;
}
.autresManif {
padding-top : 10px ;
}
#liens {
font-family : arial ;
font-size : 10pt ; position : absolute ;
left : 25% ;
bottom : 5% ;
width : 50% ;
height : 10% ;
overflow : hidden ;
z-index : 2 ;
}
#lien1 {
position : absolute ;
top : 0% ;
left : 0% ;
width : 50% ;
height : 50% ;
overflow : visible ;
}
#lien2 {
position : absolute ;
top : 0% ;
right : 0% ;
width : 50% ;
height : 50% ;
overflow : visible ;
}
#lien3 {
position : absolute ;
bottom : 0% ;
left : 0% ;
width : 50% ;
height : 50% ;
overflow : visible ;
}
#lien4 {
position : absolute ;
bottom : 0% ;
right : 0% ;
width : 50% ;
height : 50% ;
overflow : visible ;
}
.titre {
font-size : 10pt ;
color : rgb(107,134,151) ;
padding : 2px ;
font-weight : bold ;
font-style : normal ;
text-align : center ;
border-top : 2px solid rgb(80,80,80) ;
border-bottom : 2px solid rgb(80,80,80) ;
}
.margeSup {
padding-top : 8px ;
}

Code :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>test</title>
<meta name="GENERATOR" content="Arachnophilia 4.0">
<meta name="FORMATTER" content="Arachnophilia 4.0">
<meta http-equiv="Content-Type" content="text/html; charset='iso-8859-1'" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<link title="test.html" type="text/css" rel="stylesheet" href="styles/style.css" />
</head>
<body bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#800080" alink="#ff0000">
<div id="portail">
<div id="logo"> </div>
<div id="recherche">
<form method="post" action="http://www.kartoo.com/perso.php3" id="kartoo">
<div class="recherche">
Rechercher:
<input type="text" name="q" />
<input type="submit" name="submit" value="ok" style="background:rgb(204,0,0); color:white;" />
</div>
<div class="rechOption">
<input type="radio" name="lg" value="1" checked />web français    
<input type="radio" name="lg" value="0" />web mondial
</div>
<div>
<input type="hidden" name="fd" value="1" />
<input type="hidden" name="tr" value="2" />
<input type="hidden" name="bo" value="0" />
</div>
</form>
</div>
</div>
<div id="centre"> </div>
<div id="liens">
<div id="lien1">
<img src="../images/lien.gif" alt="lien.gif (859 octets)" title="lien.gif (859 octets)" /> Inscription papier - formation ES
</div>
<div id="lien2">
<img src="../images/lien.gif" alt="lien.gif (859 octets)" title="lien.gif (859 octets)" /> Inscription papier - formation ES
</div>
<div id="lien3">
<img src="../images/lien.gif" alt="lien.gif (859 octets)" title="lien.gif (859 octets)" /> Inscription papier - formation ES
</div>
<div id="lien4">
<img src="../images/lien.gif" alt="lien.gif (859 octets)" title="lien.gif (859 octets)" /> Inscription papier - formation ES
</div>
</div>
<div id="nouvelle">
<div class="titre">
Dernières nouvelles
</div>
Contenu
</div>
<div id="manifestation">
<div class="titre">
Prochaines manifestations
</div>
<div class="margeSup">
Il n'y a pas de manifestation pour l'instant.
</div>
</div>
<div id="homme"> </div>
<div id="chiffres"> </div>
<div id="femme"> </div>
</div>
</body>
</html>

Message édité par Leuen le 01-07-2004 à 09:24:27

Reply

Marsh Posté le 01-07-2004 à 09:36:32

code pas clair, et hop une erreur

Code :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
</head>
<body>
<div id="portail">
<div id="logo"> </div>
<div id="recherche">
<div class="recherche"></div>
<div class="rechOption"></div>
<div></div>
</div>
</div>
<div id="centre"> </div>
<div id="liens">
<div id="lien1"></div>
<div id="lien2"></div>
<div id="lien3"></div>
<div id="lien4"></div>
</div>
<div id="nouvelle">
<div class="titre"></div>
</div>
<div id="manifestation">
<div class="titre"></div>
<div class="margeSup"></div>
</div>
<div id="homme"> </div>
<div id="chiffres"> </div>
<div id="femme"> </div>
//</div>
</body>
</html>

Message édité par boulax le 01-07-2004 à 09:37:03

---------------
Posté depuis des chiottes, sales. Me gusta.

Reply

Marsh Posté le 01-07-2004 à 09:56:50

:heink: le /div à la fin que tu as mis en commentaire, ferme le div principal: "portail".

Reply

Marsh Posté le 01-07-2004 à 09:57:58

non. Portail est fermé a la fin du premier bloc de mon quote.

---------------
Posté depuis des chiottes, sales. Me gusta.

Reply

Marsh Posté le 01-07-2004 à 10:03:19

boulax a écrit :

non. Portail est fermé a la fin du premier bloc de mon quote.

Ce qui n'est pas très pratique pusique portail est censé être un div qui contient tous les autres.

EDIT: par contre je reconnais qu il y a une balise fermante en trop. Mais si je l'enlève cette saloperie de IE me fait n importe quoi. :fou:

Message édité par Leuen le 01-07-2004 à 10:05:46

Reply

Marsh Posté le 01-07-2004 à 10:06:05

"trop de div tue le div"

ca marche maintenant alors ?

---------------
Posté depuis des chiottes, sales. Me gusta.

Reply

Marsh Posté le 01-07-2004 à 10:11:34

url ?

---------------
Posté depuis des chiottes, sales. Me gusta.

Reply

Marsh Posté le 01-07-2004 à 10:11:34

Reply

Marsh Posté le 01-07-2004 à 10:19:11

Pas online pour l'instant.

Tu as raison mon div portail ne sert à rien !

Donc je l'ai supprimé. Tout fonctionne comme avant sous Mozilla. Par contre sous IE chiffres et liens ne s'affichent toujours pas.

Reply

Marsh Posté le 01-07-2004 à 10:20:13

t'as bien vérifié que tout se referme bien ? je vais encore jeter un coup d'oeil aux css

---------------
Posté depuis des chiottes, sales. Me gusta.

Reply

Marsh Posté le 01-07-2004 à 10:24:28

Oui j'ai relu au moins 5 fois. Mais à force on voit même plus l'érreure si il y en a une. Comme le portail par exemple j était partit au tout départ dans l'idée d un div qui contient les autre pour pouvoir le positionner et au fur et à mesure que j ai développé le reste, portail ne sert plus à rien...

Merci pour ton aide. :jap:

Reply

Marsh Posté le 01-07-2004 à 11:16:11

[:yoyoz] :cry:

Reply

Marsh Posté le 01-07-2004 à 11:22:52

Leuen a écrit :

[:yoyoz] :cry:

tu peu poster une capture d'ecran du resultat sous ie et moz ?

---------------
Posté depuis des chiottes, sales. Me gusta.

Reply

Marsh Posté le 01-07-2004 à 11:38:52

je vois pas tes images, va sur imageshack.us

---------------
Posté depuis des chiottes, sales. Me gusta.

Reply

Marsh Posté le 01-07-2004 à 11:43:52

Merci je connaissais pas ! Excellent !

Reply

Marsh Posté le 01-07-2004 à 11:53:11

tes liens1, liens2, liens3 etc... ne devraient pas etre en position absolute je pense, car comme ca il se "détachent" de leur conteneur il me semble.

---------------
Posté depuis des chiottes, sales. Me gusta.

Reply

Marsh Posté le 01-07-2004 à 11:59:03

Effectivement si je met en relative ca apparait :bounce: mais tout en ligne, je vois pas comment gérer ça pourqu'ils se mettent comme ils devraient !

Reply

Marsh Posté le 01-07-2004 à 12:03:46

mets les dans un tableau... ca marche toujours sous mozilla en parallele ?

---------------
Posté depuis des chiottes, sales. Me gusta.

Reply

Marsh Posté le 01-07-2004 à 12:58:05

Si je met en relative sous moz ca merde aussi. Ils sont pas en ligne mais y en a juste deux a gauche je pense qu ils sont l un sur l autre.

Ok je vais faire un tableau ca sera plus simple.

Sinon Pour les chiffres en bas tu as une idée ? D'après moi c'est parcqu il n y a pas de largeur définie qu IE n aime pas. Mais bon il devrait quand meme supporter ça c'est un peu la base ?!?

Message édité par Leuen le 01-07-2004 à 13:44:01

Reply

Marsh Posté le 01-07-2004 à 14:27:39

Bon merci pour ton aide, avec ces maudis chiffres rien à faire je trouve pas de solution. Le design m'est imposé alors faudra bien que j'en trouve une ....

Reply

Marsh Posté le 16-08-2004 à 10:26:24

[:yoyoz]

Reply

Marsh Posté le 18-08-2004 à 12:12:25

Dernier problème en date. J'ai un div qui contient du texte.

Ce div à une taille défini à l'aide d'un pourcentage de son conteneur (donc la page).

Sous Mozilla comme d'hab pas de prob le div fait la bonne taille.

Sous IE <- :fou: comme d'hab ca merde.

Le div se dimmensionne en fonction du texte qu'il contient et rien à foutre qu'on lui ai fixé une hauteur avec des pourcents.

Ok je pourrait définir une hauteur "fixe" en pixel. Mais il faut que mon div se redimensionne en fonction de la taille de la fenêtre.

Donc que faire ??? [:jkley]

Message édité par Leuen le 18-08-2004 à 13:31:20

Reply

Marsh Posté le 18-08-2004 à 13:31:27

[:yoyoz]

Reply

Marsh Posté le

Reply

[CSS] Texte, DIV, mauvaise taille dans IE....

Sujets relatifs:

Leave a Replay