Page 1 sur 2

[résolu] corps de page bcp trop grand par rapport au site

Posté : 03 déc. 2005, 22:57
par magouya
bonsoir à tous!

voilà je suis chargée de créer un site de rencontre mais je me retrouve face à un problème que je n'arrive pas à regler. ca n'est pas un problème énorme mais c tout de même pas normal et je voudrais rendre un travail clean pour satisfaire mon client (c'est la première fois que l'on me confie la création d'un site!).

voici l'adresse temporaire où j'ai placé mes pages por que vous puissiez y jeter un oeil

Site Souffle d'ange

Le problème est que le corps de ma page est immense par rapport à la hauteur de mon site! (la barre de srcoll descend vraiment très bas, elle ne devrais même pas exister, cela est très flagrant dans la page index)

ca me fait ca depuis que j'ai mis comme fond un tableau (car mon fond est découpé en parties pour un chargement plus rapide) suivit d'une div "conteneuse", que j'ai placée en relative pour qu'elle vienne se positionner par dessus le tableau...

voici le code html d'une des pages les plus simple ( la page


Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title> A la rencontre de l&rsquo;autre</title> <meta name="description" content=" Un concept de rencontre unique! Un souffle d&rsquo;ange dans votre vie!"/> <meta name="DC.title" content=" Un concept de rencontre unique! D&eacute;couvrez le vite! " /> <link type="text/css" rel="stylesheet" href="css/style-validations-savoirplus.css" /> </head> <body><div align="center"> <table width="800" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="4"> <img src="fonds/fine-bande/fine-bande_01.jpg" width="269" height="41" alt=""></td> <td> <img src="fonds/fine-bande/fine-bande_02.jpg" width="481" height="41" alt=""></td> <td> <img src="fonds/fine-bande/fine-bande_03.jpg" width="50" height="41" alt=""></td> </tr> <tr> <td colspan="4"> <img src="fonds/fine-bande/fine-bande_04.jpg" width="269" height="114" alt=""></td> <td> <img src="fonds/fine-bande/fine-bande_05.jpg" width="481" height="114" alt=""></td> <td> <img src="fonds/fine-bande/fine-bande_06.jpg" width="50" height="114" alt=""></td> </tr> <tr> <td> <img src="fonds/fine-bande/fine-bande_07.jpg" width="21" height="13" alt=""></td> <td> <img src="fonds/fine-bande/fine-bande_08.jpg" width="169" height="13" alt=""></td> <td> <img src="fonds/fine-bande/fine-bande_09.jpg" width="40" height="13" alt=""></td> <td colspan="2"> <img src="fonds/fine-bande/fine-bande_10.jpg" width="520" height="13" alt=""></td> <td> <img src="fonds/fine-bande/fine-bande_11.jpg" width="50" height="13" alt=""></td> </tr> <tr> <td> <img src="fonds/fine-bande/fine-bande_12.jpg" width="21" height="104" alt=""></td> <td> <img src="fonds/fine-bande/fine-bande_13.jpg" width="169" height="104" alt=""></td> <td> <img src="fonds/fine-bande/fine-bande_14.jpg" width="40" height="104" alt=""></td> <td colspan="2"> <img src="fonds/fine-bande/fine-bande_15.jpg" width="520" height="104" alt=""></td> <td> <img src="fonds/fine-bande/fine-bande_16.jpg" width="50" height="104" alt=""></td> </tr> <tr> <td rowspan="2"> <img src="fonds/fine-bande/fine-bande_17.jpg" width="21" height="328" alt=""></td> <td rowspan="2"> <img src="fonds/fine-bande/fine-bande_18.jpg" width="169" height="328" alt=""></td> <td> <img src="fonds/fine-bande/fine-bande_19.jpg" width="40" height="28" alt=""></td> <td colspan="2"> <img src="fonds/fine-bande/fine-bande_20.jpg" width="520" height="28" alt=""></td> <td> <img src="fonds/fine-bande/fine-bande_21.jpg" width="50" height="28" alt=""></td> </tr> <tr> <td> <img src="fonds/fine-bande/fine-bande_22.jpg" width="40" height="300" alt=""></td> <td colspan="2"> <img src="fonds/fine-bande/fine-bande_23.jpg" width="520" height="300" alt=""></td> <td> <img src="fonds/fine-bande/fine-bande_24.jpg" width="50" height="300" alt=""></td> </tr> <tr> <td> <img src="fonds/fine-bande/spacer.gif" width="21" height="1" alt=""></td> <td> <img src="fonds/fine-bande/spacer.gif" width="169" height="1" alt=""></td> <td> <img src="fonds/fine-bande/spacer.gif" width="40" height="1" alt=""></td> <td> <img src="fonds/fine-bande/spacer.gif" width="39" height="1" alt=""></td> <td> <img src="fonds/fine-bande/spacer.gif" width="481" height="1" alt=""></td> <td> <img src="fonds/fine-bande/spacer.gif" width="50" height="1" alt=""></td> </tr> </table> <div id="principal_fine_bande"> <div id="soufledange"><a href="index.html"><img alt="retour &agrave; l'accueil rencontre" title="retour &agrave; l'accueil rencontre" border="0" src="images/accueil.gif" /></a></div> <div id="flash"> <object type="application/x-shockwave-flash" data="diaporama-flash/essai.swf" width="120" height="90"> <param name="movie" value="diaporama-flash/essai.swf" /> <param name="quality" value="high" /> </object> </div> <div id="conteneur_texte"> <div id="texte"><br /><br /><br /><br /> L&rsquo;annonce est en cours de validation. Attention! la validation de cette annonce peut prendre jusqu'&agrave; quelques jours. Vous recevrez un mail d&egrave;s validation par l'&eacute;quipe souffledange. Merci de votre compr&eacute;hension.<br /><br /><div class="droite"><a href="#"><i>la suite...</i></a></div> </div> </div> <div id="bloc2"> <table width="590" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="39"></td> <td width="110"><a href="service-rencontre.html">Conditions generales</a></td> <td width="60"><a href="contact.html">Contact</a></td> <td width="85"><a href="temoignages-de-rencontre.html">Temoignages</a></td> <td width="80"><a href="rencontre-partenaires.html">Partenaires</a></td> <td width="75"><a href="afilliation-rencontre.html">Afilliation</a></td> <td><a href="rencontre-qualite.html">Service</a></td> <td><a href="creation.html">Creation</a></td> </tr> </table> <br /> <table width="590" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="39"></td> <td width="95"><a href="rencontre-amour.html">Rencontre amour</a></td> <td width="95"><a href="rencontre-amitie.html">Rencontre amitie</a></td> <td width="95"><a href="rencontre-celibataire.html">Rencontre projet</a></td> <td width="95"><a href="rencontre-femme.html">Rencontre femme</a></td> <td width="95"><a href="rencontre-serieuse.html">Rencontre serieuse</a></td> <td><a href="club-de-rencontre.html">rencontre</a></td> </tr> </table></div> </div> </div> </body> </html>



et voici le code de ma css:


Code : Tout sélectionner

body{ margin-bottom:0px; margin-left:0px; margin-right:0px; margin-top:10px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; } #principal_fine_bande{ width:800px; height:600px; } #soufledange{ position:relative; top:-535px; right:258px; width:149px; height:73px; padding:0 0 0 0; } #flash{ position:relative; top:-498px; right:295px; width:120px; height:90px; padding:0 0 0 0; } #bloc2{ position:relative; top:-398px; left:94px; width:590px; height:30px; font-size:8px; text-align:left; } #bloc2 a:link{ color:#FFFFFF; font-size:8px; text-decoration:none; } #bloc2 a:hover{ color:#FFFFFF; font-size:8px; text-decoration:underline; } #bloc2 a:visited{ color:#FFFFFF; font-size:8px; text-decoration:none; } #bloc2 a:action { color:#FFFFFF; font-size:8px; text-decoration:none; } .droite{ text-align:right; } .droite a:link{ color:#523316; font-size:12px; text-decoration:none; } .droite a:hover{ color:#523316; font-size:12px; text-decoration:underline; } .droite a:visited{ color:#523316; font-size:12px; text-decoration:none; } .droite a:action { color:#523316; font-size:12px; text-decoration:none; } #conteneur_texte { top:-600px; position:relative; width:515px; left:100px; } #texte{ color:#523316; text-align:left; font-size:12px; width:515px; height:190px; padding:0 0 0 0; top:400px; } #texte i{ font-size:14px; } #texte a:link{ color:#523316; font-size:12px; text-decoration:underline; } #texte a:hover{ color:#523316; font-size:12px; text-decoration:underline; } #texte a:visited{ color:#523316; font-size:12px; text-decoration:none; } #texte a:action { color:#523316; font-size:12px; text-decoration:none; }

merci beaucoup pour votre aide!
magouya

Posté : 04 déc. 2005, 22:07
par nicolas
Je trouve ta façon de procéder pour le moins étrange.
Pouquoi ne fais-tu pas une image de fond ? Ca me semblerait nettement plus simple.

Posté : 05 déc. 2005, 01:06
par Cyrano
Même réponse : au lieu d'une image découpée en plein de petits bouts, avec ta feuille de style, utilise une image unique en arriere-plan et ensuite positionne le contenu en avant-plan.

Posté : 05 déc. 2005, 10:53
par magouya
hello, tout d'abord, merci de vos réponses!!

en fait c'est exactement ce que j'avais fait au départ.. mes images de fond "entières" etaient appelées par la css.
mais la personne pour qui je fais le site trouve le temps de chargement du fond trop long (lorsque jai fait des essais en lignes, ca prenait 1 seconde avant que le fond n'arrive, c'est peu comme ca mais ca fait bizarre car le contenu texte apparaissait avant le fond...)

j'ai bien essayé de réduire la qualité de mes fonds (jusqu'à 30% de qualité sans image ready, mais ca n'est pas suffisant, et ca altère l'image.)

alors voilà je ne sais pas quelles sont les autres solutions!

moi je m'occupe de la partie HTML, et quelqu'un d'autre va s'occuper d'intégrer le PHP, y a t-il d'autres moyens d'appeler un fond en PHP? peut-on par exemple mettres les fonds en cache à l'avance??!!

Peut-etre peut-on trouver une solution de ce côté la?

merci de vos précieuses réponses!

Posté : 09 déc. 2005, 17:11
par magouya
bonjour à tous!

Je sollicite à nouveau votre aide concernant mon site, mais pour autre chose cette fois (j'ai trouvé une sollution à mon précédent problème)
pour cette page:
Image

ma cliente voudrais que dès que l'on clique sur un profil, le bandeau en papier gris suive cette selection, et se positionne sur la ligne du tableau sélectionnée.

Je ne sais pas comment faire ca? sachant que je ne peu pas fair ca en flash!
Est ce que quelqu'un à une solution à me proposer? :roll:

merci beaucoup à bientôt!

Posté : 09 déc. 2005, 17:22
par jeff
salut
tu peut le faire avec du javascript
tu met un id sur chaque profile et quand tu click tu change la couleur du background

un truc du genre

Code : Tout sélectionner

getElemenById('profile1').style.background='monimage';

Posté : 09 déc. 2005, 20:20
par DocType
Quelque chose qui n'a rien à voir...
Tu es stagiaire ou salarié ? Car cette societé avait posté une offre d'emploi pour un stagiaire, travaillant de chez lui et bcp dispo pendant quinze jours...
Donc j'étais simplement en train de me poser quelques questions...
Es-tu:
- embauché pour faire ce site ? (avec contrat et tout)
- "etudiant" qui a accepté de faire le site pour deux pommes et un oeuf ?
- stagiaire qui a bon coeur et qui a accepté leurs conditions ?

Note: Très beau ton site professionnel :wink:

Posté : 09 déc. 2005, 22:44
par magouya
hello,
pour répondre à ta question PRoGRaFLaSH, je suis étudiante.
je fais une formation en deux ans de conceptrice multimédia, et j'ai eu ce boulot parce que j'avais besoin d'effectuer un stage en entreprise cet été.
J'avais déja fait mon stage lorsque cette personne m'a contacté pour faire son site, mais j'ai accepté parce que je voudrais devenir webmaster/webdesigner alors ca m'apporte beaucoup, même si je ne suis pas payée énormément... c'est pour ca que je rencontre quelques problèmes car j'apprend en même temps...



jeff merci de ta réponse, jai effectivement pensé à utiliser du javascript, mais je sais pas exactement comment je dois proceder..?!
et puis imagine si il y a des centaines voir plus de personnes sur ce suite, ca me ferai des centaines d'ID pour chaques profils?

mmhh.. je vais tt de même essayer d'aprofondir.. :?

Si quelqu'un peu m'aider un chti peu plus?! :oops:

Posté : 09 déc. 2005, 23:39
par DocType
hello,
pour répondre à ta question PRoGRaFLaSH, je suis étudiante.
je fais une formation en deux ans de conceptrice multimédia, et j'ai eu ce boulot parce que j'avais besoin d'effectuer un stage en entreprise cet été.
J'avais déja fait mon stage lorsque cette personne m'a contacté pour faire son site, mais j'ai accepté parce que je voudrais devenir webmaster/webdesigner alors ca m'apporte beaucoup, même si je ne suis pas payée énormément... c'est pour ca que je rencontre quelques problèmes car j'apprend en même temps...
Tu devrais aller visiter la rubrique emploi... le post it.
Tu résides en suisse c'est bien ça ? Dans ce cas l'entreprise qui t'embauche (stage) le fait illégalement. Je suppose que tu bosses de chez toi ? Si c'est ça, tu fournis ton matériel, ton utilise tes propres ressources...et malheureusement c'est illégal. Encore une entreprise qui exploite les stagiaires...

Posté : 10 déc. 2005, 00:35
par magouya
alors jai trouvé quelque chose, mais jai encore un probleme.

voici mon code html

Code : Tout sélectionner

<head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Document sans nom</title> <link href="css/essai-java.css" rel="stylesheet" type="text/css" /> </head> <body><table width="540" border="0" cellspacing="0" cellpadding="0"> <tr onmouseover='this.className="class1";' onmouseout='this.className="classoriginal";'> <td height="60">bonjour</td> <td>hello</td> <td>bomdia</td> </tr> <tr onmouseover='this.className="class1";' onmouseout='this.className="classoriginal";'> <td height="60">merci</td> <td>thanks</td> <td>obrigado</td> </tr> </table> </body> </html>

et voici ma css;


Code : Tout sélectionner

.class1 { background-image:url(../images/bandeau-selection540-60.gif); } .classoriginal { }


mon probleme est que l'image qui apparait est coupé selon la taille de la cellule, alors qu'elle devrais faire toute la ligne du tableau...
je vais continuer de chercher, mais si quelqu'un peut me filer un petit coup de main! meri beaucoup!

Posté : 10 déc. 2005, 02:43
par Truc
Salut,
<HS>
hello,
pour répondre à ta question PRoGRaFLaSH, je suis étudiante.
je fais une formation en deux ans de conceptrice multimédia, et j'ai eu ce boulot parce que j'avais besoin d'effectuer un stage en entreprise cet été.
J'avais déja fait mon stage lorsque cette personne m'a contacté pour faire son site, mais j'ai accepté parce que je voudrais devenir webmaster/webdesigner alors ca m'apporte beaucoup, même si je ne suis pas payée énormément... c'est pour ca que je rencontre quelques problèmes car j'apprend en même temps...
Euh... je n'habite pas la Suisse mais on m'avait proposé ce meme stage (l'année passée, que j'ai refusé pour ces raisons)... auraient-ils recruté aussi loin ??!
</HS> :shock:

en ce qui concerne ton code je suis pas sur que l'image s'arrete a la cellule mais a sa taille et normalement elle et répétée jusqu'a la fin de la ligne, est-ce exact ?

Posté : 10 déc. 2005, 03:19
par DocType
Salut,
<HS>
Euh... je n'habite pas la Suisse mais on m'avait proposé ce meme stage (l'année passée, que j'ai refusé pour ces raisons)... auraient-ils recruté aussi loin ??!
</HS> :shock:
Le mieux c'est qu'apparemment elle a eu son contrat il y a trois mois...
Et il y a un mois la même societé laissait un message sur phpfrance où ils souhaitaient un stagiaire très très disponible pour réaliser leur site...exactement le même ! Amon humble avis, ils essaient d'avoir l'entier développement gratos, et d'avoir tout le temps un webmaster derrière :lol:
Donc je ne comprend pas trop ce qu'ils font...
Quel bande de c************ :evil: :x

Posté : 10 déc. 2005, 17:51
par magouya
coucou,

je voudrais mettre les choses au clair par rapport a ce travail, ca n'est pas une entreprise mais une femme d'une trentaine d'année qui n'a pas beaucoup de budget et qui voudrais réaliser son rêve de créer un site de rencontre par internet.

Si cette personne à passé d'autres annonces depuis que je travail dessus c'est que je ne m'occupe que du code html parce que je ne sais pas faire de PHP, et qu'elle avait donc besoin de quelqu'un d'autre pour le PHP.

Quant à ce travail je ne l'aie pas accepté en tant que stage mais en tant que mandat, avec un forfait de création de site que j'ai proposé. C'est un travail comme un autre...

mais revenons à nos moutons;
(jai posté une réponse en disans que j"avais trouvé mais finalement non, j'avais mal regardée)

en fait mon image recommence à chaques td...
j'ai essayé de mettre une classe à chaques td, au lieu d'en mettre une à la tr, ca marche mais que sur la cellule survolée évidemment, pars sur toute la ligne!

est ce qu'il existe un code javascript que l'on mettrait dans la tr, et qui dirait au td d'afficher le fond qui leur est attribués?

Posté : 10 déc. 2005, 20:39
par starkeus
Salut !
je ne comprends pas magouya car j'ai essayé avec le meme code que toi (avec juste une class par défaut)... et j'arrive au résultat que tu veux (enfin je crois :roll: )
tu souhaites avec une image de fond à chaque ligne lorsque celle-ci est survolée?
enfin sous FireFox ca marche !

EDIT: sous IE ca ne focntionne pas :lol: bon bah je vais essayer de t'aider!

Posté : 10 déc. 2005, 21:28
par magouya
(je repose ma question dans la partie javascript)

hello!
merci c'est très gentil de m'aider!
effectivement, ca marche sous firefox mais pas IE.. :cry:

on peu voir l'exemple ici

il faut absolument que je trouve une solution pour que ca marche sur les deux

est ce qu'il y aurait une autre façon d'écrire le code pour que IE comprenne?


ou tout simplement une autre façon en général?

merci beaucoup!