Discussion :

[lelectronique.com]

Bonjour,

un soucis tout bête que je ne parviens pas à résoudre pourtant il semble simple

je souhaite avoir une colonne qui s'adapte à la largeur de l'écran et une colonne fixe à droite de 300px je fais le code suivant

Code :

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
 
<style>
.col1 {
	background-color: #009;
	margin-right: 300px;
}
.col2 {
	background-color: #0F0;
	width: 250px;
	float: right;
}
</style>
 
<div>
  <div class="col1">fff</div>
  <div class="col2">ffff</div>
</div>

mon problème est que la col2 n'est pas sur la même ligne que la col1

merci d'avance
bonne après midi

[Ecared]

Inverse ton col1 et col2 dans ton code html et enlève ton margin-right :

Code :

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
 
<style>
.col1 {
	background-color: #009;
}
.col2 {
	background-color: #0F0;
	width: 250px;
	float: right;
}
</style>
 
<div>
  <div class="col2">ffff</div>
  <div class="col1">fff</div>
</div>

[lelectronique.com]

tout simplement....
merci beaucoup

[lelectronique.com]

cela fonctionne en exemple simple mais plus complexe non

[JefReb]

Il me semble que flex pourrait résoudre ce problème très simplement et sans l'utilisation de float et être responsive.

[lelectronique.com]

j'ai reinversé les colonnes mis un flex sur le div conteneur supprimer les float les colonnes sont ok sauf la largeur pourtant bien préciser 300px

[Invité]

[lelectronique.com]

[JefReb]

Ben comme Jreaux62 le dit, personne n'est Irma la voyante!
Sans un minimum de css et html, il est difficile d'aider!
code, code code dec.

[lelectronique.com]

je comprend très bien mais pour le moment ce n'est pas visible sinon je vous aurais donner le lien c'est pour un forum vbulletin rajouter une colonne sur les messages afin d’afficher les articles du sites mais du coup je vais mettre cela en ligne plus tot pour avoir de l'aide...

[Invité]

Bonjour,

ce n'est pourtant pas difficile de montrer un bout de code :

Code :

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

1
2
3
4
<div id="main">
  <div class="col1">col1</div>
  <div class="col2">col2</div>
</div>

Code :

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

1
2
3
4
5
6
7
8
9
10
11
#main {
 display:-webkit-flex; display:flex; 
}
#main > div.col1 {
 -webkit-flex:1 1 auto; flex:1 1 auto; 
  background:yellow;
}
#main > div.col2 {
 -webkit-flex:0 0 300px; flex:0 0 300px; 
  background:green;
}

[lelectronique.com]

je viens d'essayer sur ce forum vu que c'est un vbulletin aussi cela fonctionne

j'ai donc un soucis avec mon template sur le miens du coup... si vous souhaitez vraiment le voir il faut vous rendre ici https://www.lelectronique.com/forum-electronique/ vous inscrire et me donner votre identifiant par MP afin que je vous mette le template en test j'ai vu que l'on pouvait le faire

[lelectronique.com]

je viens de mettre le théme sur le forum par défaut par exemple ici https://www.lelectronique.com/forum-...2721#post72721
en bas de la discution un div test à mettre sur le cote droit

bon fin de journée