28220 sujets

CSS et mise en forme, CSS3

J'ai de gros problèmes pour centrer certains éléments sur ma page :

Exemple :

## PREMIER EXEMPLE ##
<p class=""><img ....></p>
##


## DEUXIEME EXEMPLE
<table class="">
<tr>
<td><img ....></td>
</tr>
</table>
##

Donc je voudrais que mon image soit centré sur IE sur des navigateurs "Normaux" Smiley langue

Merci d'avance
Bonjour, merci, au revoir, self service ?? règles ? recherche ? tutoriels ? FAQ ? divination du subconscient pour savoir de quoi on parle...
Ben je viens de lire la FAQ et a moins de n'avoir pas compris je suis désolé mais çà ne répond pas à ma question. Moi il s'agit d'un alignement horizontal.
Modérateur
Il y a une propriété CSS pour ca, text-align :


p {
text-align:center;
}

.taclasse {
text-align:center;
}


Je t'invite à lire des articles sur les CSS, et dans les autres secteurs aussi.

Ce serait bien que tu nous indique aussi ton niveau en CSS, question qu'on adapte nos réponses en conséquence. N'oublis pas de dire bonjour aussi quand tu pose une question, c'est plus poli. Smiley smile
Modifié par Merkel (20 Jul 2005 - 17:33)
Olivier a écrit :
Bonjour, merci, au revoir, self service ?? règles ? recherche ? tutoriels ? FAQ ? divination du subconscient pour savoir de quoi on parle...


Tu vas me trouver méchant, vilain, débile, ou je sais pas quoi d'autre, et je m'en fout un peu à la limite, c'est juste que t'as pas eu de bol, j'ai eu 2 messages du genre du tien de suite et ça m'a gavé.
Je m'explique :

Poomm poomm, premier message, même pas le droit à un bonjour... bon à la limite, mais entre la recherche du forum, la faq et les tutoriels, ne pas trouver "centrage horizontal", il faut vraiment le faire exprès...

En haut du forum, tu as un menu vachement pratique, il reprend tout ce qu'il faut savoir, tutos, faq, rechercher et aussi Aide/Règles pour ce qui concerne la politesse et les demandes de ce forum concernant la mise en forme des parties de code (entre autre) dans les messages.

Je te laisse lire pour en savoir plus.
Ce forum n'est pas un self service ce bonne réponse, c'est pas un distributeur de Coca cola, on met une piece et un bidule tombe.
Il y a un minimum d'effort à fournir histoire que tous ceux qui participent généreusement à ce forum ne se tape pas tout le temps les mêmes questions alors que tout est dis clairement, simplement, proprement dans les tutoriels, la faq ou à défaut avec la recherche.

Tu as un moteur de recherche pour le forum, un pour les tutos, un pour le blog (qui contient aussi quelques trucs interessant sur le sujet) et pour la faq, tu as la liste des questions en début qui pointe directement sur la réponse.

Si c'est pas du travail maché...

<edit>Ah oui et aussi, y a google Smiley lol
Pour t'expliquer un peu le comment du pourquoi etc, je t'invite à lire ce petit coup de gueule de la maison :
http://forum.alsacreations.com/topic.php?fid=9&tid=5341

Voilà, désolé pour le ton un peu sec, mais y a que ça qui marche.
Modifié par Olivier (20 Jul 2005 - 17:37)
Donc Bonjour : Un peu en retard mais bon .

Le text-align:center : Va me centrer du texte mais ma mon image (j'y avait pensé)

J'ai un bon niveau CSS.
Et pour le formatage du code, ça tient toujours hein !
Tu peux éditer ton premier message.

N'hésite pas à ... attend, je termine de machonner le travail pour que ça te tombe presque tout cuit dans le bec...

... à lire les tutoriels !
Administrateur
Surfeurdu33 a écrit :

Le text-align:center : Va me centrer du texte mais ma mon image (j'y avait pensé)
Text-align est une propriété qui s'applique sur tous les éléments en-ligne (pas seulement le texte, toutes les balises en-ligne, donc images également) :
http://www.yoyodesign.org/doc/w3c/css2/text.html#alignment-prop : "Cette propriété décrit l'alignement d'un contenu en-ligne dans un élément de type bloc."

Surfeurdu33 a écrit :
J'ai un bon niveau CSS.
Hmm
Modifié par Raphael (20 Jul 2005 - 17:40)
J'accèpte et je demande qu'a voir les tutoriels mais je viens de reagrder pour la deuxième fois et je vois pas ce qui correspond à mon problème.
Y'a quelqu'un qui a le liens du tutoriel en question? merci et désolé

Pour info je veux que
text-align:center
aligne aussi mon image sous IE.
Modérateur
Surfeurdu33 a écrit :

Le text-align:center : Va me centrer du texte mais ma mon image (j'y avait pensé)


Tu y avais pensé, mais l'avais-tu essayé ? Ce n'est pas parce que ca s'appeles text-align que c'est que pour du texte.

C'est comme la choucroute, ca ne veut pas dire qu'il y a seulement des choux et des crouttes dans le bol. Smiley biggol

Surfeurdu33 a écrit :

J'ai un bon niveau CSS.


Tu devrais lire les articles d'openweb, et ceux d'alsacreations. Tu pourrais augmenter ton niveau de plusieurs crans. Smiley smile
Modérateur
Surfeurdu33 a écrit :
Pour info je veux que
text-align:center
aligne aussi mon image sous IE.


Bon, pour la seconde fois, ceci fonctionne très bien sur Firefox et IE, et les autres navigateurs :


<p style="text-align:center;"><img src="aide.gif" alt="Aide" width="12" height="13" /></p>


Vérifis que tu n'as pas fais d'autres déclarations dans ton code qui viendrait empêcher cet alignement. Regarde ton fichier CSS, ton code html s'il est syntaxiquement correct etc...
Modifié par Merkel (20 Jul 2005 - 17:48)
Agagaagggaa...
Là je craque, j'ai maché tout le boulot, j'ai donné toute la réponse, y avait plus qu'à taper ça dans n'importe quel moteur de recherche (forum, tutos, google...) et la réponse était donnée...

http://css.alsacreations.com/search.php?q=centrage+horizontal&s=OK
http://forum.alsacreations.com/search.php?mots=centrage+horizontal&mt=all&fid=&type=posts&days=0&byname=&action=search
http://www.google.fr/search?hl=fr&q=centrage+horizontal+css&meta=&btnG=Recherche+Google

Tu veux un café avec ?
Et bis repetita, le formatage du code, sans blague, c'était pas pour le fun hein !
Modifié par Olivier (20 Jul 2005 - 17:48)
Et bien que ma page le text-align:center ne me centre pas mon image.
je veux bien vous croire mais là, j'ai en face de moi une page web qui m'affiche le contraire. ?? Smiley eek
Surfeurdu33 a écrit :
Et bien que ma page le text-align:center ne me centre pas mon image.
je veux bien vous croire mais là, j'ai en face de moi une page web qui m'affiche le contraire. ?? Smiley eek


Si tu nous montrais la vilain page Ouebe qui fait tout de travers qu'on y voit plus clair...
Modérateur
Surfeurdu33 a écrit :
je veux bien vous croire mais là, j'ai en face de moi une page web qui m'affiche le contraire. ?? Smiley eek


Sans vouloir être prétentieux, entre nos connaissances/expériences dans le domaine + les documentations officielles sur les CSS, et ce que te dis ta page web, disons que j'ai tendance à me fier davantage au premier. Smiley langue

Bon, montre-nous le code que tu utilise pour centrer ton element, et le code de ton element aussi. Mieux encore, donne-nous l'adresse de ta page pour qu'on voit de nos grands yeux globuleux.
Modifié par Merkel (20 Jul 2005 - 17:54)
Ca y est j'ai lu les 3 liens et c'est vrai çà parrait évident mais ..

Alors mon code :


CSS :
p.mail {width:50px;margin:auto;text-align:center}

HTML:
<p class="mail"><img src="pics/mail.gif" alt="mail"></p>


L'image n'apparait pas centré sous IE?

pareil avec


td.top {width:50px;margin:auto;text-align:center}

HTML:
<table>
<tr>
<td class="top"><img src="pics/mail.gif" alt="mail"></td>
</tr>
</table>


Ma page n'est pas encore dispo, justement j'essai de rendre mon site compatible XHTML 1.0 Strict : et c'est pas une mince affaire !!! Smiley bawling
Le margin: auto; doit se mettre sur un élément dimenssionné de type block, le dit élément étant l'élément à centrer.
Le text-align: center; (pour IE) doit être indiqué sur l'élément parent de l'élément à centrer.

Comme c'est expliqué dans les tutos.

<edit>tiens, en plus c'était pas dans le bon forum... je déplace grrmmblbl
Modifié par Olivier (20 Jul 2005 - 18:09)
Si tu pouvais uploader ta page de test sur un espace à part de ton site parceque là on peut rien trop faire, a priori ça doit marcher, il y a donc sûrement un truc dans ton code qui fait tout foirer ou je sais pas quoi.

Aide nous à t'aider, sinon on lâche l'affaire nous.
J'arrives après la guerre mais tu peux toujours mettre une balise code dans ton premier post.

Pour se faire, il suffit d'éditer ton message en cliquant sur "modifier" Smiley smile