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
CSS CONTENT STATE SELECTORS (PERSONNAL DRAFT)CSS CONTENT STATE SELECTORS (PERSONNAL DRAFT) par FREMYCOMPANY
Bonjour à tous, Je viens de publier une proposition comprenant 5 pseudo-classes pour le CSS Working Group ayant trait à l'état de chargement d'un élément (ex: IMG,VIDEO,AUDIO,OBJECT pour l'HTML.). Si le c½ur vous en dit, vous pouvez retrouver cette p...
Cliquez pour lire la suite de l'article par FREMYCOMPANY MBA : POURQUOI FAIRE ET COMMENT LE CHOISIR ?MBA : POURQUOI FAIRE ET COMMENT LE CHOISIR ? par ROMELARD Fabrice
Formation initiale Durant la formation, le découpage classique est le suivant (je donnerai les équivalences Suisse lorsque je les connaîtrais) : Ecole primaire jusqu'au Collège : Formation générale permettant d'obtenir les méthodes...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice Y'A DES ERREURS QUI PEUVENT RENDRE LE DéVELOPPEUR VIOLENTY'A DES ERREURS QUI PEUVENT RENDRE LE DéVELOPPEUR VIOLENT par Aleks
Quand on a ce genre d'erreur sans log :
Et bas on a juste envie de choper le gas de Microsoft qu'a développé ça et lui foutre des baffes de Coboye ! ...
Cliquez pour lire la suite de l'article par Aleks [HYPER-V 3] PRéSENTATION DES COMMANDLETS POWERSHELL[HYPER-V 3] PRéSENTATION DES COMMANDLETS POWERSHELL par Pierrick CATRO-BROUILLET
Avec la sortie prochaine de la Beta Consumer Preview de Windows 8, j'avais envie de revenir sur une des fonctionnalités que j'attends le plus et que, en bon geek que je suis, j'utilise déjà : Hyper-V 3 ainsi son module PowerShell.
Il y a déjà pléthor...
Cliquez pour lire la suite de l'article par Pierrick CATRO-BROUILLET IIS7 - COMPRESSION GZIPIIS7 - COMPRESSION GZIP par cyril
La compression GZIP permet d'améliorer les performances de navigation en compressant ce qu'envoie le serveur à un client. Pour comprendre comment cela fonctionne, regardons ce qu'il se passe au niveau HTTP lorsqu'un client tente d'accéder à une ress...
Cliquez pour lire la suite de l'article par cyril
Forum
SCRIPTSCRIPT par nadialadypower
Cliquez pour lire la suite par nadialadypower
Logiciels
Easy-Planning (1.0.0.1)EASY-PLANNING (1.0.0.1)Basé sur les mêmes principes que MyPlanning, Easy-Planning permet de créer des plannings sous la ... Cliquez pour télécharger Easy-Planning Academy System (17.1.3.0)ACADEMY SYSTEM (17.1.3.0)Logiciel de gestion des établissements.
- élèves/étudiants (inscription, dossier, absence...)
-... Cliquez pour télécharger Academy System COLLECTOR PLUS (3.00B)COLLECTOR PLUS (3.00B)COLLECTOR PLUS version 3.00B est un logiciel utilisant une base de données alimentée par :
- L... Cliquez pour télécharger COLLECTOR PLUS PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V7.4)PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V7.4)PONAMEDIA TV DEVIENS HELLLOOO FLASH
LA TV SUR VOTRE ORDINATEUR.
Toute une plateforme Multi... Cliquez pour télécharger PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO LettresFaciles 2011 (8.0.0.1)LETTRESFACILES 2011 (8.0.0.1)LettresFaciles est un logiciel facilitant la création et la rédaction de lettres types.
Son inte... Cliquez pour télécharger LettresFaciles 2011
|