Discussion :

[bobby51]

bonjour à tous
voila je suis en train de développer un petit web control en ASP .NET, et j'ai un problème pour positionner des boutons les uns en dessous en dessous des autre, pour le groupe de boutons ligne suivante/ligne précédante.
Enfin un bon imprim écran vaut mieux qu'un long discours vous vous rendrez mieux compte du problème (en miniatures). Actuellement le ce groupe de bouton est positionné comme ceci
- les deux boutons contenu dans une div
- le bouton ligne precedante en vertical-align : top
- le bouton ligne suivante en vertical-align : bottom
j'ai essayé de joueur avec les floats, position, white-space,... mais rien n'y fait je n'arrive pas a avoir l'effet escompté
voici le css correspondant à ces boutons

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
18
19
20
21
22
23
24
25
26
27
28
29
30
31
 
.PanelLigne
{
    background-color:Transparent;
    float:left;
}
 
.Lsuivante
{
    background-image:url(..\images\Controles\iMemoPJ\LignesuivanteInterdite.png);
    background-repeat:no-repeat;
    background-position:center center;
    background-color:Transparent;
    border-width:0;
    vertical-align:bottom;
    width:24;
    height:12;
 
}
 
.Lprecedente
{
    background-image:url(..\images\Controles\iMemoPJ\LignePrecedanteAutorise.png);
    background-repeat:no-repeat;
    background-position:center center;
    background-color:Transparent;
    border-width:0;
    vertical-align:top;
    width:24;
    height:12;
}

merci d'avance pour vos réponses

[E.Bzz]

Bonjour,

j'ai essayé de joueur avec les floats, position, white-space,... mais rien n'y fait je n'arrive pas a avoir l'effet escompté

tu as essayé de donner à ton div (celui qui ne contient que ces 2 boutons) une largeur égale à celle (d'un) des boutons ?
Le 2° bouton devrait "revenir à la ligne" et ça devrait être suffisant ...
EDIT : à ajuster ensuite avec les padding et margin, s'il reste un décalage)

A+

[bobby51]

bien joue c'etait ca!
il a aussi fallu que je mette mes 2 bouton en float:left pour bien qu'ils se calent contre le bord
solution final

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
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
.PanelLigne
{
    background-color:Transparent;
    float:left;
    width:24;
    height:24;
}
 
.Lsuivante
{
    background-image:url(..\images\Controles\iMemoPJ\LignesuivanteInterdite.png);
    background-repeat:no-repeat;
    background-position:center center;
    background-color:Transparent;
    border-width:0;
    vertical-align:bottom;
    width:24;
    height:12;
    float:left;
}
 
.Lprecedente
{
    background-image:url(..\images\Controles\iMemoPJ\LignePrecedanteAutorise.png);
    background-repeat:no-repeat;
    background-position:center center;
    background-color:Transparent;
    border-width:0;
    vertical-align:top;
    width:24;
    height:12;
    float:left;
}

encore merci pour ta réponse