28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous, je suis en train de créer des pages css et j'ai un probleme de rendu entre IE et firefox (normal me direz vous Smiley bawling ).

Je ne vois pas ce qu'il y'a comme probleme (au niveau css).
Je vous joint les 2 css


body{
font-family : Verdana;
font-size : 14px;
font-weight : bold;
/*
scrollbar-base-color:#FFFFFF;
scrollbar-3dlight-color:#FFFFFF;
scrollbar-arrow-color:#FFFFFF;
scrollbar-darkshadow-color:#FFFFFF;
scrollbar-face-color:#BE9458;
scrollbar-highlight-color:#FFFFFF;
scrollbar-shadow-color:#BE9458;
scrollbar-track-color:#BE9458;*/
background-color:#6a6b6f;
padding: 0;
margin: 0; 
}

a:hover
{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
text-decoration:none;
color:#FF8C00;
}

a
{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
text-decoration:none;
color:#000000;
}

#forum-abc
{
position : absolute;
top : 20px;
left : 50%;
margin-left : -403px;
width : 806px;
height :450px;
background-color:#FFFFFF;
overflow:auto;
}

La commune et la feuille attaché

@import url(commun.css);

table.position_tableau
{
position: absolute;
width: 800px;
top : 3px;
left : 50%;
margin-left: -400px;
cellspacing:0;
border-collapse:collapse;
}

table.position_tableau2
{
position: absolute;
width: 800px;
top: 75px;
left:50%;
margin-left: -400px;
padding:0px;
}

#mention_legale{
position:absolute;
font:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
color:#FFFFFF;
width:810px;
text-align:center;
top: 520px;
left: 50%;
margin-left: -402px;
}

#index 
{
position : absolute;
top: 54px;
left :8px;
}

#membre 
{
position : absolute;
top: 54px;
left :670px;
}

td.titre
{
font-size:115%;
width: 810px;
height: 20px;
text-align: center;
border: solid 2px;
border-color: #9bc816;
}

td.membre
{
width: 810px;
height: 16px;
text-align: center;
border: solid 2px;
border-color: #9bc816;
}

td.theme
{
background-color:#9bc816;
height: 18px;
width: 620px;
color: white;
font-size: 110%;
text-align: center;
}

td.autre
{
background-color:#9bc816;
height: 18px;
width: 95px;
color: white;
font-size: 110%;
text-align: center;
}

td.grande
{
border:solid 2px;
border-color : #9bc816;
height: 50px;
width: 620px;
font-size: 80%;
border-collapse:collapse;
text-align : left;
}

td.petite
{
border:solid 2px;
border-color : #9bc816;
height: 50px;
width: 95px;
border-collapse:collapse;
text-align: center;
}

a
{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
text-decoration:none;
color:#000000;
}

a:hover
{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
text-decoration:none;
color:#FF8C00;
}

.lien:link , .lien:visited
{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
text-decoration:none;
color:#FFFFFF;
}

.lien:hover {
color:#FF8C00;
font-size:11px;
font-family:Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
}

.rubrique:link , .rubrique:visited
{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:14px;
text-decoration:none;
color:#FF8C00;
}

.rubrique:hover {
color:#FF8C00;
font-size:14px;
font-family:Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
}


voici l'adresse oui trouver la page :
http://www.abbiccitalia.com/accueil.php

Voila si quelqu'un vois le pb merci d'avance Smiley smile
Modifié par tibere (23 May 2006 - 23:40)
Je vois pas bien la différence ...
Les interlignes sont un plus grand sous i-e .... et... ?

Pourrais-tu spécifier le problème ?
C'est au niveau du tableau du forum.
Sous IE, le tableau occupe toute la div en longueur, et sous Firefox, il y'a un grand blanc sous le tableau.
Apparement c'est la taille des TD qui different.
Si quelqu'un a une idée ^^
Ca serait pas mal d'avoir acces au forum pour voir ... Smiley cligne , car pour l'instant le lien ver le forum de ton site marche pas ...
mais je pense que dans ta feuille de style a ce niveau
#forum-abc
{
position : absolute;
top : 20px;
left : 50%;
margin-left : -403px;
width : 806px;
height :450px;
background-color:#FFFFFF;
overflow:auto;
}


le overflow est peut etre la source du problème ...
Modifié par teo (23 May 2006 - 19:30)
le lien fonctionne, enleve la balise [/url] qui s'est rajouter a la fin de l'hyperlien et du va voir le problème Smiley cligne
J'ai editer mon message c'est le liens vers le forum qui marche pas... Smiley smile
Celui du site marche effectivement Smiley biggrin .
Raphael a écrit :
Ton lien n'est toujours pas écrit correctement

Rhôô la la, il est tatillon des fois le Raphaël !
Moi pourtant tu me dis rien quand je balance des liens de trois pieds de long… c'est une négligeance ou une tolérance coupable ? Smiley rolleyes
Désolé j'etais au travail je viens de rentrer, j'ai essayer d'editer plusieurs fois le liens mais les balises se positionnent mal.
C'est un lien direct vers le forum et non vers le site normalement.
Personne ne vois d'erreur qui causerai la difference entre les 2 rendus ?
Merci.
Bonjour,
Je suis en 800X600 et j'ai le mème rendu dans les 2 cas :
La page est plus large que mon écran et une partie est inaccessible à droite et à gauche Smiley biggol
chmel a écrit :
Bonjour,
Je suis en 800X600 et j'ai le mème rendu dans les 2 cas :
La page est plus large que mon écran et une partie est inaccessible à droite et à gauche Smiley biggol

Sans oublier la hauteur, avec un bandeau qui prend les deux tiers de la fenêtre, sans qu'on puisse le scroller.

Le scroll sur la moitié de la page, c'est ergonomiquement très très moyen, quand même. Pourquoi pas un bon vieux scroll sur toute la page ? C'est dingue le nombre de personnes qui essayent de faire autrement, et qui se retrouvent à faire moins esthétique et moins ergonomique…
La page à été developpéé pour une resolution superieur a du 800*600.
Je ne vois aucune scrollbar sur cette page normalement il n'y en a aucune.
Parcontre, il est vrai que sur les pages qui suivent j'ai des div qui font 400 de hauteur avec des tableau dedans et je suis obligé de scroller dans cette div (c'est pourquoi il y'a un overflow).
Mais si vous avez d'autre idées je suis preneur.
Personne n'a de difference de rendu au niveau de la div avec un fond blanc ?
A savoir le tableau sous Ie qui occupe toute la div et le tableau sous fire qui laisse un blanc de 2cm ?


Je viens de voir le probleme mais je n'arrive pas a le resoudre Smiley decu
En fait dans chaque cases du tableau sous IE il crée un écart avec la police et apres la police ce qui mis bout à bout me fait la difference de taille du tableau.
Si quelqu'un peux me dire quoi faire ?
Le css du tableau est : position tableau 2.
Merci A l'aide !
Modifié par tibere (24 May 2006 - 20:50)
Salut

Le souci est que tu utilises tous ce qui est déconseillé sur le site : les frames, une structure en tableau, aucun respect pour l’accessibilité, ….

Et en plus tu lui mets un DOCTYPE XHTML 1.0 Strict

Donc pour ceux qui pourrait vraiment t’aider il faudrait complètement revoir le site


A+
gege71 a écrit :
Donc pour ceux qui pourrait vraiment t’aider il faudrait complètement revoir le site

Lol ça c'est le commentaire qui fait peur ! Smiley sweatdrop
mpop a écrit :

Lol ça c'est le commentaire qui fait peur ! Smiley sweatdrop


Ce n’est pas pour lui faire peur Smiley confus , car si tibere est près a faire l’effort de générer un code propre et un site valide Smiley biggrin , je pense que plusieurs personnes sont prêtes a l’aider et moi le premier Smiley biggrin , mais intervenir sur un code tel qu’il est pour l’instant Smiley biggol est très aventureux et a mon avis passer de Charybde en Scylla Smiley smile

A+
Le probleme est que je n'ai pas le temps de revoir la construction du site Smiley decu
Je n'ai pas fais attention a mon doctype et c'est sur que ce n'est pas du strict Smiley langue .
Si je met un doctype de type transitional ce la changera t'il des choses ?
Je sais que j'utilise tout ce qu'il ne faut pas mais bon les tableaux c'est a cause du sql, pour créer des <tr> automatiquement et les supprimés automatiquement.
Si c'etait un site et non un forum je n'aurai pas melanger css et tableau.
Bon ba si quelqu'un peux quand meme essayer de me guider sur d'eventuelles erreurs (genre l'ecart superieur et inferieur dans les cases du tableaux) je suis preneur Smiley smile
Merci.
Bon ba je me suis inspiré d'un css, en fait je pense que c'est tres mal de faire ca Smiley decu
Mais vu que je n'arrive pas à regler ce probleme de padding (je suppose), le rendu étant different au niveau de la taille de mes <td> j'ai donc donné une taille a firefox et une a IE en la placant dans le css apres celle de firefox :
height: 50px (supposon)
//height: 45px
Ca regle mon probleme, je sais que c'est du bricolage mais bon Smiley decu