28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous, les amisss

j'aimerai mettre en place une succession d'image horizontalement dans une page html avec scroll
ça c'est fait :

<body>
<table><tbody><tr>

<td><a href><a href="0.html">
<img src="00.jpg" height="150px" alt="Img" oncontextmenu = "return false" ondrag = "return false" onmousedown="return false"/></a></td>

<td><a href="1.html">
<img src="01.jpg" height="150px" alt="Img" oncontextmenu = "return false" ondrag = "return false" onmousedown="return false"/></a></td>

<td><a href="2.html">
<img src="02.jpg" height="150px" alt="Img" oncontextmenu = "return false" ondrag = "return false" onmousedown="return false"/></a></td>

....
</tr></tbody></table>





maintenant j'aimerai ajouter un background ou un fond noir de 170px de hauteur et pour autant qu'il y a d'image en largeur, ou un border (je pensais que c’était la solution). Mais notez que border montre un espace entre chaque images mais aussi en haut et en bas, les images ne sont pas collés !!!



Avez vous des solutions ?
comment puis-je creer ce fond en css derrière chaque images, pour laisser penser que c'est un bloc noir par exemple ?


encore merci, j'ai l'impression que ma demande est futile !!!
Modifié par kodjoed (13 Apr 2013 - 20:53)
Bonjour,

Pour moi l'utilisation d'un tableau pour faire cela est non adapté. Si tu souhaites placer des images les unes côte à côte, il y aussi 2 méthodes:

- une liste <li> avec les flotants ( float: left;)
- mettre tes images (inline) en display: inline-block;

Puis un border et un margin: 0px; pour les coller.

Comme tu affiches tes images via le code HTML tu peux alors appliquer un background-color en css.
Modifié par heatseeker (12 Apr 2013 - 08:01)
Parfait je vais faire ça :

- une liste <li> avec les flotants ( float: left;)
- mettre tes images (inline) en display: inline-block;
- mettre un border et un margin: 0px; pour les coller.

mais comment mettre un background de 170px derrière les images
et une largeur qui dépends du nombres d'images sans avoir à les
additionner pour finir avec une largeur genre : width="2480px"

parce que je compte faire ça pour plusieurs séries d'images, je dois
calculer la largeur à chaque fois ?