Discussion :

[zool.bzh]

Bonjour J'ai un problème avec flex voici ce que je veux -> oOo

les codes :

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
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<div class="flex-title">
	    <div class="itemarch gris9">Archives :</div>        
        <div class="itemproch gris9" >Prochainement :</div>
</div>
<div class="flex-container">
  <div class="itemtitle"><?php
      foreach ($partys as $partyz) {
          ?> 
	    <a href="?party=<?php echo $partyz['id']; ?>#fly"><?php echo $partyz['titre']; ?></a><br>
	  <?php
      }
      ?>
  </div>
  <div class="itemlieu gris6"><?php
       foreach ($partys as $partyz) {
             echo $partyz['lieu'] ."<br>";
        }
?>	
  </div>
  <div class="itemdate gris6"><?php
      foreach ($partys as $partyz) {
             echo $partyz['date'] ."<br>";
      }
?></div>
  <div class="rougec itemnd">-no data-</div>
 
 
<div align="center">
<?php
  if ($partyx != "") {
          $soonp = $db->prepare("SELECT id, url, scrip FROM party WHERE id = '$partyx'");
   $soonp->execute();
   $soons = $soonp->fetch();
   $count = $soonp->rowCount();
 
if ($count==1) {
        
    ?><div id="fly" align="center"><img src="/fly/<?php echo $soons['url'] ?>"/></div>
      <div class="gris9"><?php echo $soons['scrip']; ?></div>
</div><?php 
        
        } 
          else if ($tem == 0) {
                   echo "<img src='/fly/nodata.png'/>"; 
                
                   } 
           } else { 
              echo "<img src='/fly/nodata.png'/>"; 
        }
?>

archives et prochainement :

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
* {
  box-sizing: border-box;
}
flex-title {
width:650px;
border: 1px solid #666666;
  display: flex;
padding: 0;
}
.li itemarch {
  width: 475px;
 border: 1px solid #666666;
  background-color: #000000;
  color: #666666;
  font-family: arial, verdana, sans-serif;
 
}
.itemproch {
 
border: 1px solid #666666;
  background-color: #000000;
  color: #666666;
  font-family: arial, verdana, sans-serif;
}

et le reste :

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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
* {
  box-sizing: border-box;
}
 
.flex-container {
width:650px;
  display: flex;
padding: 0;
 
}
.itemlieu {
 
 margin: 0 10px 0;
  width: 200px;
  min-width: 0;
  background-color: #000000;
  color: #666666;
  font-family: arial, verdana, sans-serif;
}
.itemdate {
 
 margin: 0 10px 0;
  width: 150px;
  min-width: 0;
  background-color: #000000;
  color: #666666;
  font-family: arial, verdana, sans-serif;
}
.itemtitle {
 
margin: 0 10px 0;
 text-align: center;
  width: 425px;
  min-width: 0;
  background-color: #000000;
  color: #666666;
  font-family: arial, verdana, sans-serif;
}
.itemnd {
   width: 300px;
 
 margin: 0 10px 0;
 text-align:center;
  width: 300px;
  min-width: 0;
  background-color: #000000;
  color: #CA0000;
  font-family: arial, verdana, sans-serif;
}

si je met la demo dans cette page ça me déforme tous donc je veux l'insérer par petit bout en commencent par la -> oOo

le code :

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
* {
  box-sizing: border-box;
}
 
.flex-container {
  background-color: #f4f7f8;
  resize: horizontal;
  overflow: hidden;
  display: flex;
  margin: 1em;
}
 
.item {
  margin: 1em;
  padding: 0.5em;
  width: 110px;
  min-width: 0;
  background-color: #1b5385;
  color: white;
  font-family: monospace;
}
.none {
  flex: none;
}

Code html :

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

1
2
3
4
<div class="flex-container">
  <div class="item gris9 none">Archives : </div>
  <div class="item gris9 none">prochainement : </div>
</div>

je voudrai donc aligner Archives et Prochainement comme dois-je m'y prendre

[labarre2002]

j obtiens ca en reprenant ton code plus bas



c est bien ce que tu veux n est ce pas ??

pourquoi tu mets ca :

Code css :

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

1
2
3
4
 
.none {
  flex: none;
}

[zool.bzh]

Mes excuses pour ce post, la solution est dans mes liens css

Code html :

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

1
2
3
4
5
6
7
    <link href="css/border.css" rel="stylesheet" type="text/css" />
    <link href="css/text.css" rel="stylesheet" type="text/css" />
    <link href="css/corner.css" rel="stylesheet" type="text/css" />
    <link href="css/flex_part.css" rel="stylesheet" type="text/css" />
    <link href="flexsoon.css" rel="stylesheet" type="text/css" />
    <link href="arch2.css" rel="stylesheet" type="text/css" />
    <link href="css/deg.css" rel="stylesheet" type="text/css" />

la soluce :

Code html :

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

1
2
3
4
5
6
7
    <link href="css/border.css" rel="stylesheet" type="text/css" />
    <link href="css/text.css" rel="stylesheet" type="text/css" />
    <link href="css/corner.css" rel="stylesheet" type="text/css" />
    <link href="css/flex_part.css" rel="stylesheet" type="text/css" />
    <link href="css/flexsoon.css" rel="stylesheet" type="text/css" />
    <link href="css/arch2.css" rel="stylesheet" type="text/css" />
    <link href="css/deg.css" rel="stylesheet" type="text/css" />

et tout coule de source