Discussion :

[zool.bzh]

Bonjour

je voudrais aligner un tableau en deux colonnes comme ça :

Volila ce que j'ai :


mon code :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 <div align="center"><div>
 
			   <span class="ocrep">visiteurs :</span>
			   <span class="rouge"><?=$cont?></span>
 
			   <br/>
 
			   <span class="ocrep">Aujourd'hui :</span>
			   <span  class="rouge"><?=$addx?></span>
 
	            </br>
 
			    <span class="ocrep">connect&eacute; :</span>
			    <span class="rouge"><?=$connected?></span>
 
 
		     </div>

Comment faire ?

[Dave Hiock]

je voudrais aligner un tableau en deux colonnes comme ça :

Pour te répondre, oublie tes br, plusieurs solutions possibles dont :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<div class="flex-content">
  <span>visiteurs</span><span><?=$cont?></span>
  <!-- <br/> -->
  <span>aujourd'hui</span><span><?=$addx?></span>
  <!-- <br/> -->
  <span>connect&eacute;(s)</span><span><?=$connected?></span>
</div>

et le CSS à appliquer :

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
.flex-content {
  & {
    display: flex;
    flex-wrap: wrap;
    width: 20em;
    margin: auto;
    text-align: center;
    border: 1px solid #ABC;
  }
  span {
    display: inline-block;
    width: 50%;
    line-height: 2;
  }
  span:nth-child(odd) {
    color: #00F;
 
    &::after {
      content: ":";
      float: right;
    }
  }
  span:nth-child(even) {
    color: #F00;
  }
}

[Dave Hiock]

Il me semblait bien avoir déjà vu cela quelque part et effectivement tu avais réglé ton souci d'une autre façon, dans cette discussion : https://www.developpez.net/forums/d2.../#post11998397

[gabi7756]

Il tourne en rond dans le même manège, sans jamais apprendre à monter à cheval

[Declique69]

Et pourquoi pas une grille ?

Ton code HTML serait tout simplement :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
<div class="grid-content">
  <div>visiteurs</div><div><?=$cont?></div>
  <div>aujourd'hui</div><duv><?=$addx?></div>
  <div>connect&eacute;(s)</div><div><?=$connected?></div>
</div>

Et le CSS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
#grid-content {
   width:200px;
   display:grid;
   grid-template-columns: 1fr 1fr;
}

[zool.bzh]

Merci bien !

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<div class="grid-content">
  <div class="txt-center">visiteurs : <br/>aujourd'hui : <br/> <?=$name?> :</div>
  <div class="txt-center"><?=$cont?> <br/><?=$addx?><br/> <?=$connected?></div>
 
 </div>

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
.grid-content {
   width:110px;
   display:grid;
   grid-template-columns: 85px 25px;
 
}

tshuus !