28172 sujets

CSS et mise en forme, CSS3

Bonjour a tous,

Sur ma page d'index, j'ai créer 3 blocks (gauche, center, droit) et un menu dessous (dessous)

J'ai créer ces blocks avec des pourcentages pour que ceux ci puissent s'adapter aux différents résolutions.

Je pensais avoir réussis puisque sous mon pc principal avec firefox et une résolution de 1280x768 et sous mon pc secondaire avec iceweasel et une résolution de 800x600 tout fonctionnait a merveille.

Donc je tente avec le pc principal avec ie6 (toujours en 1280x768) et la surprise !!! mon block de droit se trouve en dessous avec le block 'dessous'.

Je suis perplexe et je ne comprend pas.

Pouvez m'aider ?

Pour les tests vous pouvez allez jeter un oeil sur mon site : http://grandvelle.en-ligne-01.biz

et voici le code de mes blocks :
#Gauche {
border-style: solid;
border-width: 1px;
background-color: #ccffff;
float: left;
font-family: "Times New Roman",Times,serif;
font-weight: bold;
text-align: left;
color: black;
font-style: normal;
width: 15%;
margin-left:10px;
}
#center {
border-style: solid;
border-width: 1px;
background-color: #E8E8E8;
float: left;
font-family: "Times New Roman",Times,serif;
font-weight: bold;
color: black;
font-style: normal;
width: 60%;
margin-left: 7px;
margin-right:7px;
padding:10px;
}
#Droit {
border-style: solid;
border-width: 1px;
background-color: #ccffff;
float: left;
font-family: "Times New Roman",Times,serif;
font-weight: bold;
text-align: left;
color: black;
font-style: normal;
width: 15%;
padding: 5px;
}
#Dessous {
border-style: solid;
border-width: 1px;
background-color: white;
font-family: "Times New Roman",Times,serif;
font-weight: bold;
color: black;
font-style: normal;
width: 80%;
clear: both;
margin-left: 7px;
margin-right:7px;
padding:10px;
}


Merci par avanceLonewolf
Modifié par lonewolf (09 Aug 2008 - 15:20)
Bonjour,

IE calcule mal les arrondis avec les pourcentage, tu peux donc utiliser un commentaire conditionnel pour ajouter une feuille de style qui réduira un peu (1% ça devrait suffire) la taille des div pour IE6 seulement.

Et juste un petit commentaire, la musique... Place plutôt le lecteur en haut de la page, ça évitera a tes visiteurs de chercher où ils peuvent l'arrêter ou de partir directement. Et si possible laisse la possibilité au visiteur de lancer lui même la musique.
Yasashii a écrit :
Bonjour,

IE calcule mal les arrondis avec les pourcentage, tu peux donc utiliser un commentaire conditionnel pour ajouter une feuille de style qui réduira un peu (1% ça devrait suffire) la taille des div pour IE6 seulement.


Ok et merci mais comment fait on cela ?

Merci pour ton aide

Amicalement
Lonewolf
Alors pour les commentaire conditionnel :

<!--[if lte IE 6]>
Appel de la feuille de style spécifique à IE 6 (et inférieurs)
<![endif]-->


Il faut le placer après l'appel à la feuille de style principale, dans le head.

Et dans la feuille de style tu précise uniquement les propriétés à modifier, donc dans ton cas:

#Gauche {
width: 14%;
}
#center {
width: 59%;
}
#Droit {
width: 14%;
}


Les valeurs seront peut-être à ajuster.
Merci encore,

j'ai trouvé la solution et en fait, elle n'avait pas de rapport avec la largeur en pourcentage de mes div (mais merci quand même ca m'a appris comment fonctionne les commentaires conditionnel Smiley biggrin . Apprendre quelque chose de nouveau, c'est toujours bon a prendre)

En fait le problème, c'etait que le submit de mon sondage prenait la valeur de 'soumettre la requête' sur IE, ce qui allongeait automatiquement ma largeur de div sous IE.

J'ai changer sa valeur en "envoyer" et tout est rentré dans l'ordre.

Merci encore pour ton aide et a charge de revanche.

Amicalement
Lonewolf

ps : pour la musique, tu as raison, je devrais peut être modifier mon autostart pour que les visiteurs puissent l'allumer quand ils le veulent
Modifié par lonewolf (09 Aug 2008 - 15:19)