Bonjour,
j'essaie vainement de mettre en page une ligne de résultat qui contient du texte et de petites images...
Je voudrais tou bêtement une ligne avec une partie fixe à gauche, une partie variable (en longueur) à droite, tout en gardant tous les éléments alignés... ça ne devrait pas être si compliqué... et pourtant je cale.
Voici mon html :
et mon css :
Résultat en image jointe (le border devrait être supprimé quand ça sera ok).
N'étant pas un as du css, je fais appel à vos talents.
Merci d'avance
ce@ceck.org
" rel="nofollow noopener" >http://www.ceck.org/
j'essaie vainement de mettre en page une ligne de résultat qui contient du texte et de petites images...
Je voudrais tou bêtement une ligne avec une partie fixe à gauche, une partie variable (en longueur) à droite, tout en gardant tous les éléments alignés... ça ne devrait pas être si compliqué... et pourtant je cale.
Voici mon html :
<div class="searching">
<div class="bloc-fixe">
18 - <a href="#" title="Afficher un album"><img class="album" src="zyx/img/actions/action_show_album.png" height="24" width="44" alt="display_album" /></a> <a href="#" title="Afficher l'image">capture_006.png
</div>
<div class="bloc-variable">
<img class="image" src="zyx/img/sap.png" height="32" alt="edit" /><img src="zyx/img/clear.gif" width="30" height="24" alt="vide" title="vide" /></a><img class="action" src="zyx/img/actions/action_next.png" height="24" width="44" alt="display_album" /><img src="zyx/img/actions/action_edit.png" height="24" width="44" alt="display_album" /><img src="zyx/img/actions/action_delete.png" height="24" width="44" alt="display_album" /><img src="zyx/img/actions/action_help.png" height="24" width="44" alt="display_album" /><img src="zyx/img/actions/action_first.png" height="24" width="44" alt="display_album" /><img src="zyx/img/actions/action_last.png" height="24" width="44" alt="display_album" />
</div>
</div>
et mon css :
.searching {
width: 750px;
height: 32px;
font-size: 1em;
font-family: "DejaVu Sans Mono", "Lucida Console", monospace;
text-align: left;
margin: 3px 0;
}
.bloc-fixe {
position:fixed;
border:solid 1px;
width:240px;
height: 32px;
}
.album {
margin-bottom: -8px;
}
.bloc-variable {
height: 32px;
position:fixed;
border:solid 1px;
margin-left:240px;
}
.action {
margin-bottom: 6px;
}
.image {
margin-bottom: 3px;
}
Résultat en image jointe (le border devrait être supprimé quand ça sera ok).
N'étant pas un as du css, je fais appel à vos talents.
Merci d'avance
ce@ceck.org
" rel="nofollow noopener" >http://www.ceck.org/