Accueil > Forum > > > > Scroll d'une div CSS + Saut de ligne images
Scroll d'une div CSS + Saut de ligne images
samedi 28 juin 2008 à 18:56:35 |
Scroll d'une div CSS + Saut de ligne images
|
samedi 28 juin 2008 à 22:53:51 |
Re : Scroll d'une div CSS + Saut de ligne images

ggtry
|
Bonsoir,
Une question bête : ta liste est bien encadrée par ton div ?
J'ai du mal à visualiser ton première problème.
(au fait, un z-index à 48, ça fait pas mal de superpositions !)
Peux-tu montrer aussi le css, et la div qui lui est en relation où s'affichent tes images ?
Cordialement,
|
|
lundi 30 juin 2008 à 18:20:08 |
Re : Scroll d'une div CSS + Saut de ligne images

Centauriel
|
Merci d'avoir répondu. La liste semble bien encadrée. Voici le code :
<div class="Style8"> <form id="form1" name="form1" method="POST" action="<?php echo $editFormAction; ?>"> <p> Name : <input name="pseudofield" type="text" id="pseudofield" size="20" /> Notation : <table bgcolor="#C9DD0A"> <tr> <td> <img src="images/etoile_orange.png" name="tick1" width="23" height="21" onclick="note1();"> <img src="images/etoile_orange.png" name="tick2" width="23" height="21" onclick="note2();"> <img src="images/etoile_orange.png" name="tick3" width="23" height="21" onclick="note3();"> <img src="images/etoile_white.png" name="tick4" width="23" height="21" onclick="note4();"> <img src="images/etoile_white.png" name="tick5" width="23" height="21" onclick="note5();"> </td> </tr> </table> <input name="notefield" type="hidden" id="notefield" value="2" /> <center><textarea name="messagefield" id="messagefield" cols="80" rows="5"></textarea> <input type="submit" name="boutonenvoyer" id="boutonenvoyer" value="Send" /></center> </p> <input type="hidden" name="MM_insert" value="form1" /> </form> </div>
Voici la déclaration CSS :
.Style8 { font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; text-align:left; }
Pour le z-index, ce n'est pas moi qui l'ai codé, vu que j'ai acheté le kit graphique. Il y a 48 déclarations CSS différentes, avec chacune un z-index correspondant à leur numéro...
|
|
lundi 30 juin 2008 à 19:00:58 |
Re : Scroll d'une div CSS + Saut de ligne images

ggtry
|
Bonsoir,
Il y a plusieurs petits problèmes d'html :
Une table ne doit pas être mise entre les balises <p> ... </p>. Tu dois fermer ton paragraphe avant d'ouvrir la table.
Ensuite, la balise <img ... doit se fermer avec /> et non avec > seul.
Toutefois, cela ne paraît pas vraiment expliquer le problème. Le problème semble être ailleurs dans la page.
Cependant, à quoi te sert ta table, puisque tu n'ouvres qu'une seule ligne et une seule colonne dans cette ligne ?
C'était un essai pour mettre les images côte à côté ? Dans ce cas, tu dois encadrer chaque image par les balises <td> ... </td>.
Pour tes listes qui s'affichent mal, il n'est pas invraisemblable qu'il y ait aussi des problèmes d'html.
|
|
lundi 30 juin 2008 à 20:38:44 |
Re : Scroll d'une div CSS + Saut de ligne images

Centauriel
|
Salut,
La table à une cellule me servait pour la background color... Je l'ai remplacé par un CSS, ce qui regle la question des balises <p>. J'ai ajouté les "/" là où il en manquait. Ca ne fonctionne toujours pas. J'ai donc fait l'astuce d'insérer les images dans un tableau avec 5 cellules sur une seule ligne. Bon ca fonctionne mais c'est lourd et pas beau du tout. Le problème est que ce tableau en question est reporté à la ligne. Est-il possible de le mettre à la suite du texte, sur la meme ligne, quitte à augmenter l'espace supérieur de la ligne de texte ?
Merci
|
|
lundi 30 juin 2008 à 21:00:54 |
Re : Scroll d'une div CSS + Saut de ligne images

ggtry
|
Réponse acceptée !
Bonsoir,
Pour ta dernière question, dans ta balise table, tu peux mettre style="display:inline". Ca devrait marcher.
Mais il est probable qu'il y ait dans ton css un endroit qui force tes images à avoir un display:block, par exemple, quelque chose du genre (ce n'est pas forcément cela, mais il faut chercher dans ce sens) :
.Style8 img {display:block}
(nb. block fait qu'un élément retourne à la ligne, inline qu'il reste sur la même ligne)
En fait, il serait mieux de chercher dans le css ce qui force tes images à revenir à la ligne que de faire un tableau.
Montre éventuellement tout le css.
Cordialement,
GGtry
|
|
mardi 1 juillet 2008 à 23:42:45 |
Re : Scroll d'une div CSS + Saut de ligne images

Centauriel
|
En effet, la page était truffée de "display:block". J'ai pu donc changer par inline et cela fonctionne. Mais je trouve néanmoins la synthaxe singulière...
#apDiv48 { position:absolute; left:95px; top:270px; width:636px; height:265px; z-index:48; overflow:scroll; }td img {display: inline;}
Sinon je n'ai toujours pas résolu mon premier problème :
La liste continue hors de la page en bas. Cela doit etre un problème de css. La déclaration css est la meme que ci-dessus. l'overflow est bien callé sur "scroll"... Est-il possible que le css du reste de la page, influe sur la partie qui ne fonctionne pas ? En faisant une recherche, je vois que le "overflow" n'est déclaré qu'ici. C'est donc une autre instruction css qui pose problème ?
Merci pour ta patience
|
|
mercredi 2 juillet 2008 à 13:01:26 |
Re : Scroll d'une div CSS + Saut de ligne images

ggtry
|
Bonjour,
Le css que tu donnes est correct. Si donc tu as bien <div id="apDiv48"> ... ta liste ... </div>, il est difficile de dire en ne voyant que cela pourquoi tu as ce problème d'affichage. Eventuellement, tu peux passer ta page au validateur w3c : http://validator.w3.org/ Si c'est une page php et qu'elle n'est pas en ligne, tu peux copier l'html rendu dans le navigateur dans un fichier .htm et l'uploader. Mais il risque de générer pas mal d'erreur (dans ce que tu donnes au début, par exemple, il y a aussi pas mal de trucs obsolètes...) Peut-être y a-t-il simplement une erreur de balisage dans ton body. C'est ce que je dirais à vue de nez. Regarde en tout cas ta page telle qu'elle est rendue en html... et montre éventuellement les endroits pertinents. Encore une fois, je ne parviens pas exactement à visualiser ce que cela rend dans ta page : une partie de la liste est dans la div, et le reste en dehors ? Mais où en dehors ? Tu dis tout en bas de page. C'est-à-dire que ta liste est coupée en deux en deux endroits différents ?
GGtry
|
|
vendredi 4 juillet 2008 à 15:53:25 |
Re : Scroll d'une div CSS + Saut de ligne images
|
vendredi 4 juillet 2008 à 17:12:17 |
Re : Scroll d'une div CSS + Saut de ligne images

ggtry
|
Réponse acceptée !
Bonjour,
Oui, en effet, il y a beaucoup d'erreurs : mais beaucoup viennent du fait qu'il y a répétition. Mais faire la toilette des alt et des attributs obsolètes ne sera pas du luxe. Cela dit, ton problème vient bien d'un balisage incorrect. Pour commencer, à la toute fin de la page, il y a tout un passage bizarre où l'on retrouve une balise head, html... Il faut bien entendu supprimer (cf. ci-dessous). Pour ta liste, en effet, une petite image vaut mieux qu'un long discours. Le problème vient de ce que le <div align center>, dans ta table est fermé deux fois : une fois juste après les img, une autre fois juste après la balise fermante de la table. Or, il n'y a qu'un div à fermer à cet endroit ! Comme tu as au tout début le <div id="apDiv48"> puis un autre <div class="Style8"> (qui eux ne sont pas à répéter), la première fermeture </div> qui est en trop ferme d'abord <div class="Style8">, puis quand de nouvelles lignes sont générées pour montrer un second enregistrement, le second /div en trop ferme apDiv48. Le résultat est donc que le reste de ta liste n'est plus dans ta div apDiv48 et se promène ailleurs dans ta page. Plus concrétement, voici la fin de ton html avec les problèmes signalés: <table width="500" border="0" align="center" heigth="100"> <tr bgcolor="#E9E9E9"> <td><span class="Style7"> yjftyjk</span></td> <td width="150"> <div align="center"> <img src="images/tick_orange.png" width="23" height="21"> <img src="images/tick_orange.png" width="23" height="21"> <img src="images/tick_orange.png" width="23" height="21"> <img src="images/tick_white.png" width="23" height="21"> <img src="images/tick_white.png" width="23" height="21"> </div> </td> </tr> <tr> <td bgcolor="#C9DD0A"colspan=2> <span class="Style8">Location : Your location (optional)</span> </td> </tr> <tr> <td colspan=2><span class="Style8">tjtfyj</span></td> </tr> <tr></tr> </table> </div> </td> <table width="500" border="0" align="center" heigth="100"> <tr bgcolor="#E9E9E9"> <td><span class="Style7"> gggggg</span></td> <td width="150"> <div align="center"> <img src="images/tick_orange.png" width="23" height="21"> <img src="images/tick_orange.png" width="23" height="21"> <img src="images/tick_orange.png" width="23" height="21"> <img src="images/tick_white.png" width="23" height="21"> <img src="images/tick_white.png" width="23" height="21"> </div> </td> </tr> <tr> <td colspan=2><span class="Style8">gggggggggg</span></td> </tr> <tr></tr> </table> </div> </td>
</div>
</td> </tr> </table> </div> </div> <div id="apDiv2"> <html> <head>
<title>XML menu.swf</title>
</td> </tr> </table>
</body> </html> </div> </body> </html>
Tout ce qui est en rouge barré ne devrait pas y être ! Surtout, pour ton problème, après la fermeture de table (</table>) tu as un
</div> </td> qu'il faut enlever. A propos, évite de mettre du javascript dans le body, surtout entre tes div (ce n'est pas très commode pour se repérer, et il est en général recommandé, quand c'est possible, de mettre le javascript entre les balises head du document).
GGtry
|
|
Cette discussion est classée dans : images, ligne, page, liste, scroll
Répondre à ce message
Sujets en rapport avec ce message
évenement sur liste modifiable [ par loulou ]
Bonjour,Je programme en asp.J'ai crée un tableau en asp dont la 2eme colonne est constituée de listes modifiables au niveau de chaque ligne. Je veux q
Upload et affichage d'images [ par nephiled ]
Bonsoir à tousContexte :J'ai un script d'upload de fichier qui fonctionne très bien.Je veux uploader des images dans un répertoire "rep".Aprés, je dés
Upload et affichage d'images [ par nephiled ]
Bonsoir à tousContexte :J'ai un script d'upload de fichier qui fonctionne très bien.Je veux uploader des images dans un répertoire "rep".Aprés, je dés
Export vers Excel à partir de page ASP ???? [ par tipnic ]
Bonjoiur, j'aimerais savoir si il est possible d'exporter une liste vers une feuille Excel à partir d'un page ASP ?exemple: la requête sur ma page ASP
[ASPX]Problème avec les images dans la page de login.aspx [ par Jeankiki ]
Bonjour à tous,J'ai un fichier Web.Config dans le dossier "/" du site et quand je démarre la page login.aspx je vois sur la page web dans la barre d'é
récupérer les données d'une liste dans une autre page [ par foofur ]
Bonjour a tous et à toutes,Je dispose de 2 listes : une contenant les champ d'une table et l'autre permettant de choisir comment l'ordre de ces champs
Pagination d'une liste avec N° de page [ par gils58 ]
Je suis à la recherche d'un code ASP qui permettrait de se déplacer directement sur une page en plus de SUITE ou RETOUR. un peu comme sur ce site lo
Comment afficher une liste d'images classées [ par Caps ]
Bonjour, je souhaiterais faire afficher les images d'un repertoire (ça, j'y arrive) mais classées par ordre de création et non par ordre alphabetique,
probleme de formulaires + affichage multipages [ par zincben ]
AU SECOURS!!!!!. Voila j'ai un probleme. J'ai une table avec des champs de type case à cocher(Moules,Metiers,Maquettes,Modeles). J'ai une premiere pa
liste deroulante / tableau [ par julevosgien ]
J'ai une page permettant de selectionner un nom parmi une liste deroulante, en validant cela m'affiche une nouvelle page avec un tableau recapitulati
Livres en rapport
|
Derniers Blogs
UNE JOLIE-HORLOGE ET PAS QU'UN PEU !UNE JOLIE-HORLOGE ET PAS QU'UN PEU ! par neodante
Pour les possesseurs d'iPhone, ça y est Bijin Tokei - qui se traduit littéralement en Français par " Jolie Horloge " - est arrivé et GRATUITEMENT s'il vous plaît ! Après la version Tokyo, Hokkaido, night club, racing, Gal, "pour les mademoiselles'", . voi...
Cliquez pour lire la suite de l'article par neodante TECHDAYS PARIS 2010 : CONNECTEZ VOS DONNéES à SHAREPOINT 2010 AVEC LES BUSINESS CONNECTIVITY SERVICESTECHDAYS PARIS 2010 : CONNECTEZ VOS DONNéES à SHAREPOINT 2010 AVEC LES BUSINESS CONNECTIVITY SERVICES par ROMELARD Fabrice
Animé par: Gaetan Bouveret et Julien Chomarat Business Connectivity Services (BCS) est dans SharePoint 2010 la version 2 de Business Data Catalog (BDC dans SharePoint 2007). Il s'agit de la solution permettant de visualiser des données provenan...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice [DIVERS] SUIVRE VOS SéRIES PRéFéRéS SUR LA TOILE[DIVERS] SUIVRE VOS SéRIES PRéFéRéS SUR LA TOILE par orion
Comme de nombreux geek, je suis un grand amateur de série TV et je rate régulièrement des épisodes de mes séries préférés. Une solution s'offre à vous avec ce merveilleux site : Tv Gorge - www.tvgorge.com Moteur de recherche à l'appui, vous pouvez ...
Cliquez pour lire la suite de l'article par orion TECHDAYS PARIS 2010 : LA BI DANS SHAREPOINT 2010TECHDAYS PARIS 2010 : LA BI DANS SHAREPOINT 2010 par ROMELARD Fabrice
Animé par: Vincent Bellet et Baptiste Giraudier La BI dans SharePoint 2010, Les nouveaux services d'application dans SP2010 et SQL Server Reporting services 2008 R2. La BI dans SharePoint est généralisée pour tous afin de permettre à tous les coll...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice
Forum
URL REWRITINGURL REWRITING par hudon77
Cliquez pour lire la suite par hudon77
Logiciels
DB-MAIN (9.1.0)DB-MAIN (9.1.0)DB-MAIN is a data-modeling and data-architecture tool. It is designed to help developers and anal... Cliquez pour télécharger DB-MAIN Xilisoft DPG Convertisseur (5.1.37.0120)XILISOFT DPG CONVERTISSEUR (5.1.37.0120)Xilisoft DPG Convertisseur offre aux fans de Nintendo DS une bonne solution leur permettant de dé... Cliquez pour télécharger Xilisoft DPG Convertisseur GraphicsGale (2.01.01)GRAPHICSGALE (2.01.01)GraphicsGale est un logiciel de PixelArt avec de nombreuse fonctionnalités permettant de réalisé ... Cliquez pour télécharger GraphicsGale Architecte 3D (Platinum 2010)ARCHITECTE 3D (PLATINUM 2010)Architecte 3D Platinium vous permet de concevoir facilement les plans votre future maison, de l'é... Cliquez pour télécharger Architecte 3D TeamViewer 5 (TeamViewer 5)TEAMVIEWER 5 (TEAMVIEWER 5)Dépanner un ami,expliquer une manipulation devient un jeu d'enfant.
Prise en main d'un autre ord... Cliquez pour télécharger TeamViewer 5
|