Fork me on GitHub






Vriska
probleme bloc de droite avec tableau
#1
Aspirant
Inscrit: 20/09/2004 02:59
De Antony
Messages: 64
alors voici mon soucis, dans une de mes page j'ai mis un tableau afin d'y mettre des images mais des que j'essais de mettre en option 1 pour que les blocs de droites apparaissent ils se retrouvent inclus dans mon tableau ! un autre soucis des que j'incere ce fameux tableau je peux plus mettre mon lien pour le retour en page d'accueil en bas de ma page chaque fois il se retrouve en haut, je pige plus rien .....

voici a quoi ressemble ma page
sans blocs de droite puis avec blocs de droite

en fait je dois merdouiller quelque part parce que tout deraille des que je met ce tableau mais je ne sais pas comment faire, merci de votre aide.

voici ma page en php:

Citation :
<?php
include("../mainfile.php");
include(XOOPS_ROOT_PATH."/header.php");

$xoopsOption['show_rblock'] = 1; // 1 = Avec blocs de droite - 0 = Sans blocs de droite
?>

<html>
<head>
<meta http-equiv="imagetoolbar" content="no" />
</head>

<body width=100%>
<TABLE height=100% width=100%>
<TR>
<TD valign=top bgcolor=#fae5c7>
<DIV>
<br>
<P align=center><FONT face="Lucida Handwriting, Cursive" size=5><STRONG><U>Vriska a 4 mois </U></STRONG></FONT></P>
<P align=center><TABLE borderColor=#a65f54 cellSpacing=2 cellPadding=2 border=2>
<TBODY>
<TR><TD><P>&nbsp;</P> <P align=center><IMG SRC="http://bonny.jexiste.fr/mespages/4mois8.jpg"><P align=center><FONT face="Lucida Handwriting, Cursive" size=2 color=#641305><U>La premiere baignade au parc</U></A></FONT></P></TD>
<TD><TD><P>&nbsp;</P> <P align=center><IMG SRC="http://bonny.jexiste.fr/mespages/4mois7.jpg"><P align=center><FONT face="Lucida Handwriting, Cursive" size=2 color=#0000ff><U>Dormir c'est cool !!</U></A></FONT></P></TD></TR>
<TR><TD><P>&nbsp;</P> <P align=center><IMG SRC="http://bonny.jexiste.fr/mespages/4mois6.jpg"><P align=center><A HREF="jeuxstrike.wmv"><FONT face="Lucida Handwriting, Cursive" size=2 color=#0000ff><U>L'amour !!</U></FONT></A></P></TD>
<TD><TD><P>&nbsp;</P> <P align=center><IMG SRC="http://bonny.jexiste.fr/mespages/4mois5.jpg"><P align=center><FONT face="Lucida Handwriting" SIZE=2><STRONG><U>...</U></FONT></A></P></TD></TR>
<TR><TD><P>&nbsp;</P> <P align=center><IMG SRC="http://bonny.jexiste.fr/mespages/4mois4.jpg"><P align=center><FONT face="Lucida Handwriting" SIZE=2><STRONG><U>...</U></FONT></A></P></TD>
<TD><TD><P>&nbsp;</P> <P align=center><IMG SRC="http://bonny.jexiste.fr/mespages/4mois3.jpg"><P align=center><FONT face="Lucida Handwriting" SIZE=2><STRONG><U>...</U></FONT></A></P></TD></TR>
<TR><TD>&nbsp;</P> <P align=center><IMG SRC="http://bonny.jexiste.fr/mespages/4mois2.jpg"><P align=center><FONT face="Lucida Handwriting" SIZE=2><STRONG><U>...</U></FONT></A></P></TD>
<TD><TD><P>&nbsp;</P> <P align=center><IMG SRC="http://bonny.jexiste.fr/mespages/4mois1.jpg"><P align=center><FONT face="Lucida Handwriting" SIZE=2><STRONG><U>...</U></FONT></A></P></TD></TR>
<br>
<br>
<P align=center><A HREF= "http://bonny.jexiste.fr"><STRONG><P align=center><FONT face="Lucida Handwriting" size=5 color=#0000ff><U> RETOUR A L'ACCUEIL </U></FONT></STRONG></A></P>
<br>
<br>

<!-- DEBUT DU SCRIPT INTERDIRE COPIER LES IMAGES --><script language="JavaScript1.2">
/*
SCRIPT EDITE SUR L'EDITEUR JAVASCRIPT
http://www.editeurjavascript.com
*/

function ejs_nodroit()
{
alert('Clic droit interdit');
return(false);
}

document.oncontextmenu = ejs_nodroit;
</script><!-- FIN DU SCRIPT INTERDIRE COPIER LES IMAGES-->
</body>

</html>

<?php
include(XOOPS_ROOT_PATH."/footer.php");
?>

Posté le : 22/06/2006 02:37
Partager Twitter Partagez cette article sur GG+
Rapport Haut
Christian
Re: probleme bloc de droite avec tableau
#2
Xoops accro
Inscrit: 04/02/2003 01:54
De Le Mans
Messages: 12273
Je te propose d'utiliser le code ci-dessous, qui fonctionne (à voir ici). Je n'ai pas utilisé de tableaux juste des listes avec un peu de style, c'est ainsi plus simple à lire.

Pour ton javascript, tu peux le rajouter bien sur, mais c'est comme si tu mettais une barrière de 0,50cm (facile à sauter par dessus).

<?php
include("../mainfile.php");
include(XOOPS_ROOT_PATH."/header.php");

$xoopsOption['show_rblock'] = 1; // 1 = Avec blocs de droite - 0 = Sans blocs de droite
?>

<style type="text/css" />
h2 {text-align: center;}
#wrap{
    width:720px;
    margin:0 auto;
    position:relative;
}
#main-content li{
    width:303px;
    border:solid #CCC;
    border-width:0 1px 1px 0;
/* uncomment and adjust this if you want a rounded frame in Mozilla browsers
    -moz-border-radius:20px;
 */
    background:#FFF;
    padding:10px;
    text-align:center;
    position:relative;
    float:left;
    display:inline;
    margin:5px;
}
img{
    border:1px solid #EEE;
/* delete line above and uncomment this for an inset effect
    border:1px solid;
    border-color:#666 #EEE #EEE #666;
 */
}

</style>
<div id="wrap">
  <h2>Vriska a 4 mois</h2>
  <div id="main-content">
    <ul>
      <li><img src='http://bonny.jexiste.fr/mespages/4mois8.jpg'  width='300' height='225' style='border-width: 0px;' /></li>
      <li><img src='http://bonny.jexiste.fr/mespages/4mois7.jpg'  width='300' height='225' style='border-width: 0px;' /></li>
      <li><img src='http://bonny.jexiste.fr/mespages/4mois6.jpg'  width='300' height='225' style='border-width: 0px;' /></li>
      <li><img src='http://bonny.jexiste.fr/mespages/4mois5.jpg'  width='300' height='225' style='border-width: 0px;' /></li>
      <li><img src='http://bonny.jexiste.fr/mespages/4mois4.jpg'  width='300' height='225' style='border-width: 0px;' /></li>
      <li><img src='http://bonny.jexiste.fr/mespages/4mois3.jpg'  width='300' height='225' style='border-width: 0px;' /></li>
      <li><img src='http://bonny.jexiste.fr/mespages/4mois2.jpg'  width='300' height='225' style='border-width: 0px;' /></li>
      <li><img src='http://bonny.jexiste.fr/mespages/4mois1.jpg'  width='300' height='225' style='border-width: 0px;' /></li>
    </ul>
    </div>
</div>    

<?php
include(XOOPS_ROOT_PATH."/footer.php");
?>

Posté le : 22/06/2006 10:59

Vous connaissez la recherche
Solutions professionnelles Xoops
Partager Twitter Partagez cette article sur GG+
Rapport Haut
Vriska
Re: probleme bloc de droite avec tableau
#3
Aspirant
Inscrit: 20/09/2004 02:59
De Antony
Messages: 64
merci c'est cool d'avoir repondu aussi vite je vais essayer ca ce soir une fois que bébé sera couché ;) (cool

par contre j'ai besoin de mettre un lien sous mon tableau pour aller sur la page suivante et je n'arrive pas a l'integrer pourrais tu m'aider encore un peu ?? (oups

Posté le : 22/06/2006 12:05
Partager Twitter Partagez cette article sur GG+
Rapport Haut
Christian
Re: probleme bloc de droite avec tableau
#4
Xoops accro
Inscrit: 04/02/2003 01:54
De Le Mans
Messages: 12273
Ce n'est pourtant pas très compliqué :

<a href="http://bonny.jexiste.fr/mespages/page2.php">Page suivante</a>

Posté le : 22/06/2006 12:27

Vous connaissez la recherche
Solutions professionnelles Xoops
Partager Twitter Partagez cette article sur GG+
Rapport Haut
Vriska
Re: probleme bloc de droite avec tableau
#5
Aspirant
Inscrit: 20/09/2004 02:59
De Antony
Messages: 64
ben finalement j'ai pu essayer pendant la sieste et ca va pas du tout regarde tout est encadré meme les blocs (oups

en plus l'avantage avec un tableau c'est que ca permet de commenter les images sans aucun decalage, bref je sais pas si ca va marcher un jour mon truc (help

Posté le : 22/06/2006 14:51
Partager Twitter Partagez cette article sur GG+
Rapport Haut
Christian
Re: probleme bloc de droite avec tableau
#6
Xoops accro
Inscrit: 04/02/2003 01:54
De Le Mans
Messages: 12273
C'est pas si grave que cela, c'est que la balise img est définie deux fois une fois dans le fichier xoops.css et une seconde dans la partie style que je t'ai ajouter.

Il suffit de modifier ainsi pour que cela fonctionne :

<?php
include("../mainfile.php");
include(XOOPS_ROOT_PATH."/header.php");

$xoopsOption['show_rblock'] = 1; // 1 = Avec blocs de droite - 0 = Sans blocs de droite
?>

<style type="text/css" />
h2 {text-align: center;}
#wrap{
    width:720px;
    margin:0 auto;
    position:relative;
}
#main-content li{
    width:303px;
    border:solid #CCC;
    border-width:0 1px 1px 0;
/* uncomment and adjust this if you want a rounded frame in Mozilla browsers
    -moz-border-radius:20px;
 */
    background:#FFF;
    padding:10px;
    text-align:center;
    position:relative;
    float:left;
    display:inline;
    margin:5px;
}
.img2{
    border:1px solid #EEE;
/* delete line above and uncomment this for an inset effect
    border:1px solid;
    border-color:#666 #EEE #EEE #666;
 */
}

</style>
<div id="wrap">
  <h2>Vriska a 4 mois</h2>

  <div id="main-content">
    <ul>

      
      <li><img src='http://bonny.jexiste.fr/mespages/4mois8.jpg'  width='300' height='225' style='border-width: 0px;' class='img2' /></li>
      <li><img src='http://bonny.jexiste.fr/mespages/4mois7.jpg'  width='300' height='225' style='border-width: 0px;' class='img2'/></li>
      <li><img src='http://bonny.jexiste.fr/mespages/4mois6.jpg'  width='300' height='225' style='border-width: 0px;' class='img2' /></li>
      <li><img src='http://bonny.jexiste.fr/mespages/4mois5.jpg'  width='300' height='225' style='border-width: 0px;' class='img2' /></li>
      <li><img src='http://bonny.jexiste.fr/mespages/4mois4.jpg'  width='300' height='225' style='border-width: 0px;' class='img2' /></li>
      <li><img src='http://bonny.jexiste.fr/mespages/4mois3.jpg'  width='300' height='225' style='border-width: 0px;' class='img2' /></li>
      <li><img src='http://bonny.jexiste.fr/mespages/4mois2.jpg'  width='300' height='225' style='border-width: 0px;' class='img2' /></li>
      <li><img src='http://bonny.jexiste.fr/mespages/4mois1.jpg'  width='300' height='225' style='border-width: 0px;' class='img2' /></li>
    </ul>
    </div>
</div>    

<?php
include(XOOPS_ROOT_PATH."/footer.php");
?>

la classe img est renommée en img2 et on ajoute le style dans la balise img

Si la présentation en tableau parait facile avec un éditeur wisiwyg(dreamweaver, frontpage,etc..) ce n'est pas la meilleure sémantique. L'utilisation d'une feuille de style stockée dans le cache du navigateur client permet une séparation des données et de la présentation, une affichage plus rapide, et une meilleure accessibilité.

Posté le : 22/06/2006 16:08

Vous connaissez la recherche
Solutions professionnelles Xoops
Partager Twitter Partagez cette article sur GG+
Rapport Haut

 Haut   Précédent   Suivant



Vous pouvez voir les sujets.
Vous ne pouvez pas débuter de nouveaux sujets.
Vous ne pouvez pas répondre aux contributions.
Vous ne pouvez pas éditer vos contributions.
Vous ne pouvez pas effacez vos contributions.
Vous ne pouvez pas ajouter de nouveaux sondages.
Vous ne pouvez pas voter en sondage.
Vous ne pouvez pas attacher des fichiers à vos contributions.
Vous ne pouvez pas poster sans approbation.
Propulsé avec XOOPS | Graphisme adapté par Tatane, Grosdunord, Montuy337513

28 Personne(s) en ligne (18 Personne(s) connectée(s) sur Forum) | Utilisateur(s): 0 | Invité(s): 28 | Plus ...