 |
||
| ||
| |||||
| Dernière réponse | |
|---|---|
| Sujet : [HTML/CSS] -> balise <HR> | |
| potiron | bon ben si ce n'est qu'une question de gout je vais continuer avec mes class :D merci |
| Aperçu |
|---|
| Vue Rapide de la discussion |
|---|
| potiron | bon ben si ce n'est qu'une question de gout je vais continuer avec mes class :D merci |
| youdontcare | >> je viens de tester ta 1ere soluce et re-BRAVO http://complet1.free.fr/i/c/biggthumpup.gif, ca fonctionne partout (IE/NS/Opera) et je suis presque sur que ca fonctionnera jusqu'au 4.x :D :) j'ai quand même un cadre sous ie6 qui entoure l'image ... ça ne se voit pas si tu utilises une image carrée. mais pour un truc un peu spécial / transparent / etc., c'est pas très beau. >> tu preferes utiliser <span> .. pourquoi ? je sais que <span> ne fonctionne qu'avec 1 type d'element mais je les utilise jamais (div/span) .. surement a tort . quand j'ai besoin d'appliquer un CSS a un element je definie juste un class= ou au pire un style= ... comme je le disais plus haut, c'est juste une histoire de goût. j'ai appris l'html et les css complètement sur le tas (et j'en ai encore appris avec ces messages :D) et la première manière que j'ai vue d'appliquer un style sur un texte était de passer par <span>. c'est tout. ne te focalise pas sur le type de balise que tu utilises, tu peux de toute façon redéfinir la majorité des comportements d'une balise avec les css (ie faire se comporter un <span> comme un <blockquote>, un <p> comme un <li>, etc. tu trouves que c'est le merdier ? moi aussi :D) |
| skylight |
|
| potiron | youdontcare : ah bon sang alors la BRAVO http://complet1.free.fr/i/c/biggthumpup.gif http://complet1.free.fr/i/c/biggthumpup.gif j'avais fait des tests mais les miens ont rien donné .. comme quoi j'aurai du plus insister au lieu de laisser tomber ! j'en connais un qui doit etre entrain de cherche un trou de souris pour s'y cacher ... :lol: --------------- je viens de tester ta 1ere soluce et re-BRAVO http://complet1.free.fr/i/c/biggthumpup.gif , ca fonctionne partout (IE/NS/Opera) et je suis presque sur que ca fonctionnera jusqu'au 4.x :D j'en profite pour te poser une question , la je suis sur d'avoir une reponse intelligente :D tu preferes utiliser <span> .. pourquoi ? je sais que <span> ne fonctionne qu'avec 1 type d'element mais je les utilise jamais (div/span) .. surement a tort . quand j'ai besoin d'appliquer un CSS a un element je definie juste un class= ou au pire un style= ... [edtdd]--Message édité par potiron--[/edtdd] |
| youdontcare | pour rester simple :D ...
la propriété qui contrôle le type d'affichage est 'display'. sa valeur 'block' est le mode d'affichage de <div> : le rectangle formé par l'élément prend toute la largeur du document. par défaut, <img> est 'inline', ie elle s'affiche à la suite du texte, et du texte juste derrière sera affiché juste après. <span> marche de la même façon qu'une image. maintenant, tu te fais ta classe : .myHR { display: block; height: 40px; background-image: url('image.jpg'); background-repeat: no-repeat; background-position: center center; } tu peux l'utiliser un peu partout, ça produira le même résultat avec des balises différentes - balises qu'il FAUT fermer. <p class='myHR'></p> <span class='myHR'></span> <div class='myHR'></div> etc ... (c'est une histoire de goût - perso j'utilise <span> pour ce genre de trucs) pour être le plus compatible possible, je pense que tu devrais utiliser le tag image, avec une classe spécifique pour spécifier le 'retour à la ligne' et l'alignement. ça te permettra aussi d'utiliser plusieurs types d'images dans ton document pour faire l'équivalent de <hr>. .myHR2 { display: block; text-align: center; } <img src='image.jpg' class='myHR2'> et voilà ... t'as plus qu'à choisir :D |
| youdontcare | en suivant ton idée d'utiliser les listes, en voici un qui marche sous ie6 :
hr { height: 0px; width: 0px; display: list-item; list-style-image: url('image.jpeg'); list-style-position: inside; } et évidemment (:D) ça ne marche pas sous mozilla ... mais je n'ai pas la toute dernière build. à tester ... |
| youdontcare | un truc possible est de définir la couleur de <hr> comme transparente et de lui assigner une image de fond. il faut alors spécifier la hauteur :
hr { height: 40px; color: transparent; background-image: url('image.jpg'); } si tu veux avoir juste une copie de l'image, tu la centres et tu spécifies 'aucune répétition' pour le fond : hr { ... background-position: center center; background-repeat: no-repeat; } problème : ie6 et mozilla dessinent un cadre autour de la balise. solution mozilla : rajouter border: solid 0px; solution ie6 : je cherche toujours ... c'est typiquement le genre de petit truc qui agaaaaace. grrr ... |
| benou | pkoi mettre un tableau de 100% de largeur avec ton image en background ??? |
| potiron | ouaip, le navi qui ce rapproche le + est NS6 ou Opera 6 sauf erreur mais alors surtout pas IE !
la W3C a envoyé une note a M$ pour leur dire que leur navigateur derivait du standart qu'il essayait de mettre en place, M$ a repondu (a peu pres) qu'ils pouvaient aller ce faire foutre avec leur norme ! :o |
| antp |
|
| skylight |
|
| potiron | ok, merci a ... tous :D pas grave, j'ai trouvé une super solution pour faire ce que je voulais -> je decoupe un bout de papier en rectangle sur lequel je dessine ma separation et je le ballade sur l'ecran a l'endroit voulu .. l'effet est genial ... maintenant va falloir convaincre les visiteurs du site de faire pareil :D :lol: |
| skylight |
|
| antp |
[edtdd]--Message édité par antp--[/edtdd] |
| Bruce |
|
| potiron | ok, merci skylight : les attributs HTML je les ai vu et c'est bien maigre, je pensais qu'avec les CSS il aurait été possible de définir une image ... en clair j'esperais trouver une propriétés CSS genre list-style-image mais pour les <hr> -> tout ce que j'ai essayé ne donne rien .. :crazy: bruce non seulement tu es tres fort pour te moquer mais en plus tu sors un bon paquet d'anneries a la minute en parlant sans savoir sans compter qu'en plus le texte de mon 1er message n'est pas une affirmation mais plus une question . -> le <hr> sans parametres permet d'automatiquement séparer la largeur de la page ... un <img> ne le fait pas ou alors faut donner une largeur en % (100%) mais ca merde sur certain navigateurs + versions :sarcastic: |
| Bruce |
|
| skylight |
|
| skylight | les balise HR ne prennent en compte que les parametre NOSHADE, WIDTH, HEIGHT, COLOR
c'est ce qu'il me semble, a vérifier. |
| Bruce | :lol: T trop fort... <IMG SRC=""> tu connais ? :D |
| potiron | salut,
j'arrive pas a trouver une propriété/attribut qui me permettrait de définir une image quelconque a la place de la ligne dessiné par la balise <HR> . je sais qu'il est possible de le faire avec les pustules des <ul> mais avec <HR> je trouve pas . quelqu'un a une idée ? merci |
