Prob Largeur cellule sous Internet explorer (uniquement)

[superseba888]

Bonjour,

Voici le lien qui pose problème :

http://www.fizzyexpress.com/fizzypro/52 ... 032&pg=520

Si vous ouvrez celui-ci avec IE, vous aurez directement compris le souci.

En effet, sous IE, le panneau du milieu (je l'ai mis en rouge pour la visibilité) s'étire horizontalement, jusqu'à plusieurs fois la largeur de la page.

Par contre, j'ai testé sous opera, firefox et safari, la page est nickel (soit 470 pixels de large pour ce panneau du milieu).

J'ai testé à restesté pas mal de choses : la largeur des autres éléments de la page, des tableaux contenant, etc etc.
Rien n'y fait.

Il semble qu'il y ait un élément à l'intérieur du tableau qui "pousse", si j'ose dire.
Quoi je sais pas, c'est toutes balises <p> avec juste de la mise en forme de couleur etc, pas de taille. (Normalement ça doit juste s'adapter à la cellule).


C'est curieux que ça marche partous sauf sur IE. J'ai entendu dire qu'il était un peu "spécial" au niveau de l'interprétation.

Quelqu'un a-t-il déja eu ce genre de souci, et comment peut-on solutionner ?

Merci pour votre aide.

[/quote]

 

[Koxin-L]

ehhhhhh...
Hop !
http://css.alsacreations.com/Modeles-de ... age-en-CSS

Ya plus qu'à...

 

[Marie-Aude]

L'envoie pas sur Alsacréation, il va se faire taper sur les doigts pour sa mise en page avec les tableaux (et pas à tort

Question : pourquoi un code aussi compliqué ?

 

[arnaudmn]

L'envoie pas sur Alsacréation, il va se faire taper sur les doigts pour sa mise en page avec les tableaux (et pas à tort

C'est vrai qu'il a un peu abusé des tableaux. Mais je pense pas qu'il pourra faire la même chose avec des div. 3 colonnes de même taille, je crois qu'on peut pas (à moins que les 2 de chaques cotés soient dans la même couleur ...)

 

[Marie-Aude]

C'est vrai qu'il a un peu abusé des tableaux. Mais je pense pas qu'il pourra faire la même chose avec des div. 3 colonnes de même taille, je crois qu'on peut pas (à moins que les 2 de chaques cotés soient dans la même couleur ...)

Si c'est l'enfance de l'art. Layout 3 colonnes avec un header au dessus, tous les blogs le font. . Les petits boutons nouveau client, client existant sont simplement dans le header. En fait tu imbrique un div de plus... Et avec des couleurs différentes en plus
Au pire si il n'est pas à l'aise là dedans il fait trois colonnes et des div à l'intérieur au lieu d'imbriquer des tables comme ça.

 

[superseba888]

Bonjour,
Et avant tout un grand merci pour vos réponses.

Voilà, j'ai été sur alsacréations, j'ai ajouté le code que j'ai trouvé, mais sur une balise <td> :

table.modE2A {
vertical-align:top;
background-color:green;
position: relative;
width: 470px;
margin: 0 auto;
}

Mais ça marche pas

Bon, cependant, ce qui est sur alsa, ça ne concerne pas des tableaux.

Vous aurez compris que je suis nouveau en css. J'ai utilisé des tableaux car avant j'avais bcp programmé en html pur, ce qui apparemment est dépassé.

Je voulais avoir votre avis, car j'envisage de recommencer, mais avec des DIV. (Tous les textes étant dans une base SQL, ça ne devrait pas être si long).

Les codes de alsacréations sont, il est vrai, vachement plus simples !!! (donc ça me tente très fort)

Ma question est la suivante :
Est-ce que, en utilisant les div, il y aura moins de chance d'avoir des soucis avec les différents navigateurs ?

SInon, je voulais aussi vous demander pourquoi je me fais taper sur les doigts en utilisant les codes de alsacréations ....

Voilà, merci encore pour vos infos.

Je rajouterai : c'est en forgeant, qu'on devient etc etc....

Bonne soirée

 

[Marie-Aude]

Tu ne te fais pas taper sur les doigts en utilisant les codes d'alsacréations, mais je pense que si tu leur montres ton site ils t'exploqueront comme nous qu'il y a mieux.

Premièrement, même pour une mise en page en tableaux, ton code est AFFREUX.
Tu redéfinis des propriétés sans nécessité, dans uen table beaucoup de propriétés s'héritent, il y en a que tu peux placer au niveaux des rangées, au lieu des cellules, bref le code résultat est beaucoup trop lourd et - pour moi - indébuggable.

Je te rassure tu peux faire aussi "pas bon" avec des div
L'avantage des div par rapport aux tableaux, c'est qu'ils sont plus faciles à comprendre en terme de structure, et qu'ils sont aussi plus facilement interprétables par les navigateurs non graphiques. Tu te débarrasse de tous les tr, td, etc...

Maintenant, pour ce que tu veux faire tu vas avoir besoins de 5 conteneurs, 1 pour le header et 4 pour les trois colonnes (voilà la page sur Alsacréations :
http://css.alsacreations.com/Faire-une- ... t-flottant)

Une définition de liste pour ton menu de gauche (je te laisse chercher liste menu sur alsa) pour ta colonne centrale une définition de h1, de h2, de liste et de paragraphe),et tu peux mettre des div align=center dans le code mais si c'est moyen, pour ta colonne de droite, styler ton formulaire, deux classes de h2 pour les rubriques, et une classe de div encore pour les données de contact.
Et pour ton header, éventuellement 6 classes différentes (y compris tes deux boutons).

Donc en comptant la deuxième classe que tu feras pour affecter des couleurs différentes à tes colonnes selon qu'on est en nouveau client ou pas, tout compris entre 20 et 30 classes ou id pour structurer toute ta page.

Plus simple non ?

Simplement avant, documentes toi sur les css, essaies surtout de comprendre comment les propriétés s'héritent et comment on peux combiner plusieurs classes pour un même élément.

 

[arnaudmn]

Maintenant, pour ce que tu veux faire tu vas avoir besoins de 5 conteneurs, 1 pour le header et 4 pour les trois colonnes (voilà la page sur Alsacréations :
http://css.alsacreations.com/Faire-une- ... t-flottant)

Bonne chance pour faire pareil Comme expliqué en bas de page, c'est assez simple si on a une largeur fixe ; ça l'est beaucoup moins avec une largeur variable.
Quoi que, tout bien réfléchi, il doit vouloir une largeur fixe en fait.

 

[superseba888]

Je vois ....

Si je comprends bien les div ont "à peu près" la même utilité que les tableaux, en terme de positionnement, mais dans un code plus "light".

La seule chose est qu'ils ont un mode de fonctionnement complètement différent.

Avant de m'y lancer (car j'ai décidé de recommencer, mais avec des div) j'avais encore ceci à vous demander de confirmer :

- Ca reste du HTML, donc pas de souci pour insérer du PHP etc ..
- Dans les div, on ajoute des <p>, des <h1> comme dans les tableaux ?
- Dès que l'on a compris les régles de float et d'inherit, on peut par ex. mettre plusieurs div l'un à coté de l'autre ??

Voilà, si la réponse est oui à ces trois choses, je bucherai à fond ce qu'on dit sur alsacreations, et (sans vouloir craner), je pense que ça devrait aller.

Merci encore pour votre temps !

 

[Koxin-L]

...html pur, ce qui apparemment est dépassé.

Tout les loco au charbon :wink:

 

[superseba888]

oui, mais bon LOL
c'est pour ça que je consulte les spécialistes que vous êtes :lol:

 

[Marie-Aude]

Je vois ....

Si je comprends bien les div ont "à peu près" la même utilité que les tableaux, en terme de positionnement, mais dans un code plus "light".

La seule chose est qu'ils ont un mode de fonctionnement complètement différent.

Avant de m'y lancer (car j'ai décidé de recommencer, mais avec des div) j'avais encore ceci à vous demander de confirmer :

- Ca reste du HTML, donc pas de souci pour insérer du PHP etc ..
- Dans les div, on ajoute des <p>, des <h1> comme dans les tableaux ?
- Dès que l'on a compris les régles de float et d'inherit, on peut par ex. mettre plusieurs div l'un à coté de l'autre ??

Voilà, si la réponse est oui à ces trois choses, je bucherai à fond ce qu'on dit sur alsacreations, et (sans vouloir craner), je pense que ça devrait aller.

Merci encore pour votre temps !

oui, oui et oui

 

[Marie-Aude]

Bonne chance pour faire pareil Comme expliqué en bas de page, c'est assez simple si on a une largeur fixe ; ça l'est beaucoup moins avec une largeur variable.
Quoi que, tout bien réfléchi, il doit vouloir une largeur fixe en fait.

Meuh non c'est pas si compliqué que ça :
http://www.cssplay.co.uk/layouts/3cols.html
En fait je trouve les exemples de ce site plus clairs que ceux d'Alsacréations...

conteneur, left, right, center c'est pas dur quand même
Sinon tu as -http://www.v2.mezgarne.com qui est aussi un trois colonnes fluide avec descente jusqu'en bas de la page Et en plus avec deux colonnes dans la colonne centrale

 

[arnaudmn]

Meuh non c'est pas si compliqué que ça :
http://www.cssplay.co.uk/layouts/3cols.html
En fait je trouve les exemples de ce site plus clairs que ceux d'Alsacréations...

Faudra que je test avec du vrai contenu. Parce que sur alsacréations aussi, on dirait que ça fonctionne ... jusqu'a ce qu'on mette de vrai chose dedans. En fait, jusqu'a ce que ça ne dépasse pas la taille de l'écran, ça fonctionne ; au delà j'y suis pas arrivé (mais j'ai pas du chercher assez )

 

[arnaudmn]

Meuh non c'est pas si compliqué que ça :
http://www.cssplay.co.uk/layouts/3cols.html

Les 2 colonnes sont en effet en couleur ... mais vu comme c'est fait, on peut pas remplacer la couleur par une image.