Page 1 sur 1
tableau et images en "vignettes" avec nvu ou kompo
Publié : 30 mars 2007, 16:54
par esmeralda
Bonjour à tous !
je voudrais avoir sur ma page, une grande image sur la gauche (jusque là, ok) et aligné sur la droite, un tableau, avec plusieurs petites images, toutes de la même dimension, style vignette. Mais je n'y arrive pas ! je suis entrain de m'arracher les cheveux ! si quelqu'un pouvait m'aider un peu ???
Merci à tous !
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
Publié : 30 mars 2007, 17:03
par chinon37
Je n'avais pas très bien compris ce que tu cherchais quand tu as posté sur Framasoft (framagora)
Je n'ai pas le temps ce soir, mais si j'ai 5 mn demain matin, je te prépare quelque chose.... Mais si d'autres t'aident avant, ce sera encore mieux
ça serait sympa !
Publié : 30 mars 2007, 19:32
par esmeralda
merci Chinon37 !
ça serait vachement sympa si tu avais 5 mn oui !
j'espère bien que d'autres vont m'aider, mais tu es la seule bonne âme pour le moment ! lol !
merci !
bisous
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
Publié : 30 mars 2007, 20:07
par Fabrice.Tres.Net
Rapidement voici quelques indices
Les images sont du type inline et un tableau est du type block.
Les éléments de type inline se suivent sur la ligne comme les caractères dans un mot ou une phrase.
Les éléments de type Block s'empile verticalement.
Donc si tu mes une image puis un tableau, le tableau se retrouvera en dessous de l'image.
Mais heureusement il est possible de "forcer" un élément de type block en type "inline" accessible à partir des propriétés de la boite (style inline)
.
Il est aussi possible d'utiliser un div qui flotte à droite pour ranger les vignettes dedans... tu choisis la largeur du div pour recevoir 1 ou 2 ou 3 vignettes horizontalement, les retours "à la ligne" se feront alors automatiquement... tu mets une marge aux éléments de type vignette pour éviter qu'elles ne se touchent!
Publié : 31 mars 2007, 09:59
par chinon37
Fabrice, tu es sympa, mais je ne suis pas sûr que notre invitée comprenne très bien notre charabia: amha, elle veut beaucoup plus simple.
Esmeralda, j'ai concocté un truc du plus basique qui correspond peut être à ce que tu cherches:
clique
ici
Les carrés de couleur sont les images. Si tu clique sur une image celle-ci s'affiche en grand. Il te suffit de remplacer les images bleu1, vert1 et rouge1 (petites) par tes miniatures et les vert2, bleu2 et rouge2 par tes grandes images.
C'est basique, il faudra affiner...
Pour récupérer le code de la page dans firefox:
tu vas sur une des pages que j'ai faites:
ctrl+u > ctrl+a > ctrl+c
Tu vas dans kompozer
Nouvelle page > onglet source > ctrl+a > ctrl+c
Tu peux repasser sur l'onglet aperçu
merci beaucoup !
Publié : 31 mars 2007, 11:10
par esmeralda
Fabrice, Chinon37,merci à tous les deux ! c'est sympa de m'aider !
alors, oui, tu as raison CHinon 37, c'est un truc dans le genre que je voulais
le plus simple pour moi ! lol ! suis trop nulle sinon ! j'ai copié ton code et tout et tout. J'en demande beaucoup, je sais....
En fait, je voudrais la grande image à gauche, les petites à droite, sans couleur, sans pied de page ni entête.....
Ouais, je sais, vous allez me trucider ! lol !
mais je vous avoue que je suis vraiment, mais alors vraiment nulle ! j'étais persuadée que je pouvais faire ça facilement, comme dans front page ! quelle gourde ! merci à tous les deux !
gros bisous !
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
si je savais comment vous envoyer la page qui me cause souci
Publié : 31 mars 2007, 11:14
par esmeralda
Encore moi ! décidemment ! si je savais comment vous envoyer la page qui me cause soucis, ça serait plus clair pour vous non ? Si vous voulez toujours m'aider ! lol !
mais je ne sais pas envoyer dans le forum une page en pj...
Bisous
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
Publié : 31 mars 2007, 12:00
par chinon37
Tu peux nous envoyer le code en allant sur l'onglet source: ctrl+a puis ctrl+c
puis dans le message que tu écris sur le forum: Ctrl+v pour coller le code.
Sinon, si tu le peux, tu mets ta page en ligne, même incomplète: on pourra y regarder.
Ce que tu demandes est très simple, si j'ai le temps... , je te le fais
code source !
Publié : 01 avr. 2007, 21:42
par esmeralda
wahou ! je sais pas si vous allez comprendre quelque chose... Ca fait long comme écritures tout ça ! lol ! moi je suis perdue ! merci pour ton aide ! ça me fait chaud au coeur !
j'espère que t'as passé un bon we !
bisous et merci !
Code : Tout sélectionner
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<meta name="GENERATOR" content="Microsoft FrontPage 6.0"><meta
name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type"
content="text/html; charset=windows-1252"><title>Visite
guidée</title></head>
<body><p><font size="5"><b>Visite guidée</b></font></p>
<table style="border-width: 0px;" border="1"
height="539"> <tbody><tr> <td rowspan="4"
style="border-style: none; border-width: medium;" align="left"
height="535"> <img
src="photo/ext%E9rieur%20maison/6206_2.jpg" border="0"
height="362" width="482">
<p> </p> <p>Le bâtiment
principal, avec ses deux chambres d'amis et un petit salon à
l'étage. </p></td>
<td style="border-style: none; border-width: medium;"
bordercolorlight="#000000" height="130"> <a
href="visite%20guidee/cuisine.htm"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/cuisine.jpg"
align="top" border="0" height="102" width="167"></a>
</td> <td style="border-style: none; border-width: medium;"
bordercolorlight="#000000" height="130"> <a
href="visite%20guidee/salon%20bibliotheque.htm"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/salon%20biblioth%E8que.jpg"
align="texttop" border="0" height="116" width="91"></a>
</td> <td style="border-style: none; border-width: medium;"
bordercolorlight="#000000" height="130"> <a
href="visite%20guidee/escalier.htm"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/montee%20escalier%20%283%29.jpg"
align="texttop" border="0" height="118" width="89"></a>
</td> <td style="border-style: none; border-width: medium;"
bordercolorlight="#000000" height="130"> <a
href="visite%20guidee/salon.htm"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/salon%201er%20etage%20table.jpg"
align="texttop" border="0" height="118" width="91"></a></td>
</tr> <tr> <td
style="border-style: none; border-width: medium;"
bordercolorlight="#000000" align="left" height="131"
valign="top"> <a
href="visite%20guidee/ch%20botero.htm"><img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/ch%20rose%20table.jpg"
align="texttop" border="0" height="116"
width="151"></a> </td>
<td style="border-style: none; border-width: medium;"
bordercolorlight="#000000" bordercolordark="#000000"
height="131" valign="top"> <a
href="visite%20guidee/sdb%20botero.htm"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/ch%20rose%20sdb.jpg"
align="top" border="0" height="116" hspace="6"
vspace="3" width="90"></a></td> <td
style="border-style: none; border-width: medium;"
bordercolorlight="#000000" bordercolordark="#000000"
height="131" valign="top"> <a
href="visite%20guidee/ch%20TM.htm"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/chambre%20Marthe%20bis.jpg"
align="top" border="0" height="123" vspace="3"
width="92"></a></td> <td
style="border-style: none; border-width: medium;"
bordercolorlight="#000000" height="131" valign="top">
<a href="visite%20guidee/SDB%20CH%20TM.htm"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/ch%20jaune%20sdb%20evier.jpg"
align="texttop" border="0" height="115" vspace="3"
width="88"></a></td> </tr> <tr> <td
style="border-style: none; border-width: medium;"
bordercolorlight="#000000" height="133" valign="top">
<a href="visite%20guidee/cabanon.htm"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/6206_3.jpg"
align="texttop" border="0" height="117" hspace="6"
width="159"></a></td> <td
style="border-style: none; border-width: medium;"
bordercolorlight="#000000" height="133" valign="top">
<a href="visite%20guidee/escalier%20cabanon.htm"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/escaliers.jpg"
align="texttop" border="0" height="143"
width="100"></a> </td> <td
style="border-style: none; border-width: medium;"
bordercolorlight="#000000" height="133" valign="top">
<a href="visite%20guidee/coin%20salon.htm"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/coin%20salon%201.jpg"
align="texttop" border="0" height="141" width="99"></a></td>
<td style="border-style: none; border-width: medium;"
bordercolorlight="#000000" height="133" valign="top">
<a href="visite%20guidee/terrasse%20chapeau.htm"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/terrasse1.jpg"
align="texttop" border="0" height="124" vspace="3"
width="81"></a> </td> </tr> <tr> <td
style="border-style: none; border-width: medium;"
bordercolorlight="#000000" height="135" valign="top">
<p align="justify"> <a
href="visite%20guidee/bassin%20fa%E7ade.htm"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/Photo%20039.jpg"
align="top" border="2" height="126" width="98"></a></p></td>
<td style="border-style: none; border-width: medium;"
bordercolorlight="#000000" height="135" valign="top">
<a href="visite%20guidee/chaise%20longue.htm"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/Image%20008.jpg"
align="texttop" border="2" height="115" vspace="3"
width="87"></a> </td> <td
style="border-style: none; border-width: medium;"
bordercolorlight="#000000" height="135" valign="top">
<p align="center"> <a
href="visite%20guidee/palmier%20bassin.htm"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/6206_1.jpg"
align="top" border="2" height="72" vspace="3"
width="108"></a> </p></td> <td
style="border-style: none; border-width: medium;"
bordercolorlight="#000000" height="135" valign="top">
<a href="visite%20guidee/cabanon2.htm"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/cabanon%202.jpg"
align="top" border="2" height="70" hspace="6"
width="101"></a></td> </tr> </tbody></table>
<p> </p>
<p> </p>
<table align="left" border="0" cellpadding="3"
cellspacing="4" height="650" width="84%"> <tbody><tr>
<td height="267" width="36%"> <img
src="../Documents%20and%20Settings/HP_Propri%E9taire/Mes%20documents/Mes%20sites%20Web/maisonnette3.jpg"
border="2"><p>La petite maison</p></td> <td
height="50%" valign="top" width="13%">
<table border="0" cellpadding="0"
cellspacing="0" height="646" width="156"><!-- MSTableType="layout" --> <tbody><tr>
<td height="114" valign="top"><!-- MSCellType="ContentBody" --> <a
href="visite%20guidee/maisonnette/salon.htm"> <img
src="salon.jpg" align="top" border="2"
height="102" width="152"></a></td> </tr>
</tbody></table> </td> <td height="267"
valign="top" width="8%"> <table
border="0" cellpadding="0" cellspacing="0"
height="603" width="156"><!-- MSTableType="layout" --> <tbody><tr>
<td height="117" valign="top"><!-- MSCellType="ContentBody" --> <a
href="visite%20guidee/maisonnette/cuisine.htm">
<img src="cuisine%20echelle%20meniere.jpg" align="left"
border="2" height="110" width="146"></a></td>
</tr> <tr> <td height="486" width="156"> </td>
</tr> </tbody></table> </td> <td
height="267" valign="top" width="9%"> <table
cellpadding="0" cellspacing="0" height="160"
width="104"><!-- MSCellFormattingTableID="1" --> <tbody><tr>
<td height="160" width="104"><!-- MSCellFormattingType="content" --> <a
href="visite%20guidee/maisonnette/sdb.htm"> <img
src="evier%20douche.jpg" border="2" height="149"
width="100"></a></td> </tr> </tbody></table>
<p> </p></td> <td height="267"
valign="top" width="15%"> <a
href="visite%20guidee/maisonnette/chambre.htm"> <img
src="2002%20-%20Maisonnette%20coin%20chambre%202.jpg" border="2"
height="113" width="173"></a><p> </p></td>
<td height="267" valign="top" width="12%"> <a
href="visite%20guidee/maisonnette/devant%20de%20porte.htm"> <img
src="photo/maisonnette/Image%20011.jpg" border="0"
height="115" width="100"></a><p> </p></td>
</tr> </tbody></table>
<p> </p>
<p> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"><a href="bienvenue.htm">Bienvenue</a>/
<a href="situation.htm">Situation</a> / <a
href="plan.htm">Plan d'accès</a> /
<a href="tarifs_et_contact.htm">Tarifs et Contact</a>
/ <a href="accueil.htm">Retour à l'accueil</a></p>
</body></html>
lien !
Publié : 01 avr. 2007, 22:17
par esmeralda
coucou ! j'ai fait un autre truc pour mettre en ligne, espérant que tu puisses voir. J'ai un site sur mes cartes :
http://membres.lycos.fr/cartenfolie/
tu vas dessus, puis dans accueil, album cartes, et là, sous le tableau : visite guidée. C'est la fameuse page que je voudrais pouvoir faire ! qui n'a aucun rapport avec mon site
je vais pas pouvoir la laisser longtemps ! on va se demander ce qu'elle fait sur mon site ! lol !
est ce que c'est mieux pour toi que le code source du message d'avant ?
Merci et bisous !
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
Publié : 02 avr. 2007, 09:13
par chinon37
J'ai refait une page en exemple qui pourrait peut-être te convenir
ici
Chaque carré représentant une photo. A toi d'adapter ensuite cette page en récupérant le code source comme expliqué dans le message du 31 mars.
Bise
super ! merci !
Publié : 02 avr. 2007, 12:14
par esmeralda
super ! je me débrouille bien mieux grace à vous tous ! et toi chinon 37 ! merci pour votre aide tous, ton aide précieuse, tes conseils !
je viendrais vite dès que j'aurais des soucis !
de tout coeur, merci pour tout ! un forum comme ça, c'est vraiment le pied !
gros bisous et encore merci !
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3