Peut-on mettre 2 tableaux côte à côte ?

FRED28 · Message par **FRED28** » 15 juil. 2007, 10:19

Bonjour!

j'aimerai savoir s'il est possible de mettre de 2 tableaux côte à côte avec NVU ??

Merci de vos réponses

!

Cordialement. Frèd.

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; Orange 7.4 ; NaviWoo1.1; .NET CLR 1.1.4322)

Mongo Bob · Message par **Mongo Bob** » 15 juil. 2007, 16:19

oui

Message envoyé avec : Opera/9.21 (Windows NT 5.1; U; fr)

jpbardiau · Message par **jpbardiau** » 15 juil. 2007, 16:49

Mongo Bob a écrit :oui

Là, tu m'as pris de court, j'allais répondre la même chose.

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; wa; rv:1.8.1.4) Gecko/20070515 Firefox/2.0.0.4

Mongo Bob · Message par **Mongo Bob** » 15 juil. 2007, 17:01

quoique "mettre de deux tableaux"?... c'est peut-être pas la bonne réponse, "oui"...

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.4) Gecko/20070515 Firefox/2.0.0.4

jpbardiau · Message par **jpbardiau** » 15 juil. 2007, 17:35

Bon, soyons un peu sérieux.
Pour positionner un tableau : cliquer gauche dans le tableau pour le sélectionner, dans la barre d'état cliquer droit sur <table> > Styles internes > Propriétés de la boîte, et là, on positionne et on dimensionne le tableau comme on le désire en position absolue.
Même chose pour le deuxième tableau.

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; wa; rv:1.8.1.4) Gecko/20070515 Firefox/2.0.0.4

Message par **chinon37** » 15 juil. 2007, 21:20

Il est aussi possible de positionner le 1er tableau en flottant gauche. Le 2eme, pour peu qu'il reste de la place à droite, s'y positionnera tout seul comme un grand. Dans ce cas, pas de position absolue et les tableaux resteront dans le flux du contenu de la page.

Mongo Bob · Message par **Mongo Bob** » 15 juil. 2007, 21:52

De toute façon, il vaut mieux éviter les positions absolues qui posent d'autres problèmes.
Enfin, il faut mettre les 2 en flottant gauche pour qu'ils se juxtaposent. Si seulement le 1er, le 2ème, même avec toute la place du monde, restera en-dessous : un bloc dans le flux se positionne sous son voisin du dessus, même s'il a la place d'aller à côté.
Démo? Code?

Code : Tout sélectionner

Juxtaposé :
#div1 {
	float: left;
    border: 1px solid #ffcccc;
   width: 50px;
    }
    #div2 {
	float: left;
    border: 1px solid #ffcccc;
    width: 50px;
    }
1 dessus flottant, 1 dessous dans le flux:
#div1 {
	float: left;
    border: 1px solid #ffcccc;
   width: 50px;
    }
    #div2 {
	border: 1px solid #ffcccc;
    width: 50px;
    }
1 dessus, 1 dessous aussi, tous les 2 dans le flux :
#div1 {
	 border: 1px solid #ffcccc;
   width: 50px;
    }
    #div2 {
	    border: 1px solid #ffcccc;
    width: 50px;
    }

<edit> au fait, j'ai pris des <div>, les tableaux sont des blocs comme les <div> (donc, remplacer <div> par <table> et la suite...</edit>

<edit 8h46>une bêtise dans le code corrigée, damned!</edit>
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.4) Gecko/20070515 Firefox/2.0.0.4

FRED28 · Message par **FRED28** » 17 juil. 2007, 11:02

Merci, ça marche !!;-)

BYe, Frèd.

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; Orange 7.4 ; NaviWoo1.1; .NET CLR 1.1.4322)

Message par **chinon37** » 17 juil. 2007, 17:53

MB, peux-tu me dire quelle différence d'affichage tu as entre ces deux codes:

Code : Tout sélectionner

 <body style="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255);" alink="#000099" link="#0000FF" vlink=
  "#FF0000">
    <table style="text-align: left; float: left; width: 446px; height: 60px;" border="1" cellpadding="2" cellspacing=
    "2">
      <tbody>
        <tr>
          <td></td>
          <td></td>
        </tr>
        <tr>
          <td></td>
          <td></td>
        </tr>
      </tbody>
    </table><br>
    <table style="text-align: left; width: 484px; height: 60px;" border="1" cellpadding="2" cellspacing="2">
      <tbody>
        <tr>
          <td></td>
          <td></td>
        </tr>
        <tr>
          <td></td>
          <td></td>
        </tr>
      </tbody>
    </table><br>
  </body>

ou

Code : Tout sélectionner

 <body style="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255);" alink="#000099" link="#0000FF" vlink=
  "#FF0000">
    <table style="text-align: left; float: left; width: 446px; height: 60px;" border="1" cellpadding="2" cellspacing=
    "2">
      <tbody>
        <tr>
          <td></td>
          <td></td>
        </tr>
        <tr>
          <td></td>
          <td></td>
        </tr>
      </tbody>
    </table><br>
    <table style="text-align: left; width: 484px; height: 60px; float: left;" border="1" cellpadding="2" cellspacing=
    "2">
      <tbody>
        <tr>
          <td></td>
          <td></td>
        </tr>
        <tr>
          <td></td>
          <td></td>
        </tr>
      </tbody>
    </table><br>
  </body>

"Flottant: permet de positionner un élément à gauche (ou à droite) dans son parent.
le reste du contenu du parent occupera alors l'espace laissé libre en commençant par s'écouler autour du flottant" (Raphael Goetter - memento css)

Mongo Bob · Message par **Mongo Bob** » 17 juil. 2007, 23:22

Aucune, ils sont pas juxtaposés non plus, d'ailleurs, même si on modifie les largeurs, ils restent décalés verticalement. Or, la question de départ était "comment mettre 2 tableaux côte à côte" je suppose parfaitement alignés.
Si Fred28 veut 2 tableaux côte à côte mais décalés verticalement, alors c'est ce qu'il lui faut.
Dans le code que j'ai donné, 2 blocs <div> se juxtaposent parfaitement parce qu'ils sont tous 2 en flottant, 2 autres restent l'un au-dessus de l'autre, soit parce que tous 2 dans le flux, soit parce que l'un flottant, l'autre dans le flux
(et j'ai pris exprès des petites largeurs pour qu'il n'y ait pas d'ambigüité sur l'empêchement qu'ils pourraient subir à se coller à côté du voisin). As-tu essayé, pas sûr... Je viens de réafficher ce code, ça marche, avec des <div>.
Il y aurait une différence de comportement entre tableau et n'importe quel bloc type <div>? Peut-être et du coup au temps pour moi.
Je ne vais pas me pencher sur la question, je n'utilise jamais de tableau, j'ai cru piger que Fred28 voulait 2 tableaux à la même hauteur.

le reste du contenu du parent occupera alors l'espace laissé libre en commençant par s'écouler autour du flottant" (Raphael Goetter - memento css)

Je sais pas ce que Goëtter entend exactement par "s'écouler autour..." mais pas de se juxtaposer parfaitement par rapport au flottant, à mon avis.

Message envoyé avec : Opera/9.21 (Windows NT 5.1; U; fr)

Mongo Bob · Message par **Mongo Bob** » 27 juil. 2007, 11:20

Au fait, Goëtter écrit aussi (retour de vacances, je retrouve mes bouquins préférés) :

bouquin CSS2, p.116 a écrit :Un des nombreux avantages du positionnement flottant est la possibilité de placer des blocs côte à côte. Transformer les deux paragraphes de l'exemple en flottant les fait ainsi apparaître au même niveau :
Code : Tout sélectionner
p#premier {
float: left;
width: 100px;
background: #ccc;
}
p#second {
float: left;
width: 150px;
background: green;
}

Dois-je insister : au même niveau

Comme je le disais, mais j'ai jamais eu de retour, dommage, peut-être les tableaux ne se conduisent-ils pas comme des blocs? Pourtant ce sont des blocs, là, mystère...

Geckozone

Peut-on mettre 2 tableaux côte à côte ?

Peut-on mettre 2 tableaux côte à côte ?

Qui est en ligne ?